/* Kinetic Corridors route accents. The complete family system lives in style.css. */
.family-kinetic .kinetic-page-hero--start .eyebrow,
.family-kinetic .kinetic-page-hero--contact .eyebrow { color: var(--signal); }

.family-kinetic .kinetic-page-hero--about .eyebrow,
.family-kinetic .kinetic-page-hero--corridors .eyebrow { color: var(--blue); }

/* About: adapt the existing light-backed TPI mark to the dark surface.
 * Keep its geometry and warm accent; custom dark-logo uploads remain untouched.
 * The existing responsive logo slots still control desktop/mobile visibility. */
html[data-theme="dark"] .family-kinetic.page-template-templatesabout-php
  .tpi-logo-set :is(.tpi-logo--desktop-dark, .tpi-logo--mobile-dark):is(
    [src$="/tpi-kinetic-corridors-site-logo.png"],
    [src$="/assets/images/tpi-logo.png"]
  ) {
  filter: invert(1) hue-rotate(180deg);
  mix-blend-mode: screen;
}

.corridor-filters {
  display: grid;
  grid-template-columns: repeat(3, 1fr) auto;
  gap: 12px;
  align-items: end;
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--paper-strong);
}
.corridor-filters label { display: grid; gap: 8px; }
.corridor-filters label span,
.corridor-enquiry form label > span,
.tracking-form label span {
  color: var(--ink-soft);
  font: 600 .6rem "IBM Plex Mono", monospace;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.corridor-filters select,
.corridor-enquiry input,
.tracking-form input {
  min-height: 48px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 0;
  padding: 11px 13px;
  background: transparent;
  color: var(--ink);
}
.demo-label { display: flex; gap: 8px; margin: 12px 0 30px; font-size: .65rem; }
.demo-label .dashicons { color: var(--signal); }
.corridor-cards { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); }
.corridor-cards article { min-height: 340px; padding: 28px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.corridor-cards article:last-child { border-right: 0; }
.corridor-cards article > span { color: var(--blue); font: 600 .62rem "IBM Plex Mono", monospace; }
.corridor-cards h2 { margin: 88px 0 18px; font-size: 2.2rem; }
.corridor-cards p { margin-bottom: 10px; font-size: .72rem; }
.corridor-cards small { display: block; min-height: 48px; color: var(--signal); font-size: .58rem; text-transform: uppercase; }
.corridor-cards a { display: inline-flex; margin-top: 28px; color: var(--blue); font-size: .68rem; font-weight: 700; text-transform: uppercase; }
.corridor-enquiry { background: var(--paper-blue); }
.corridor-enquiry__layout { display: grid; grid-template-columns: minmax(0, 36%) minmax(0, 1fr); gap: 70px; }
.corridor-enquiry form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.corridor-enquiry form label { display: grid; gap: 8px; }
.corridor-enquiry .form-status,
.corridor-enquiry .checkbox-field,
.corridor-enquiry button { grid-column: 1 / -1; }

.track-hero { padding-top: 58px; background: var(--navy); color: #fff; }
.track-hero__grid { display: grid; grid-template-columns: 43% 57%; min-height: 620px; }
.track-hero__grid > div:first-child { align-self: center; padding: 60px 70px 70px 0; }
.track-hero h1 { color: #fff; font-size: clamp(4.8rem, 7.1vw, 7rem); }
.track-hero p { color: #aebfd0; }
.track-hero figure { position: relative; margin: 0; }
.track-hero figure .concept-notice { position: absolute; right: 14px; bottom: 14px; max-width: 390px; }
.tracking-form { display: grid; grid-template-columns: 1fr; gap: 12px; margin-top: 30px; padding: 20px; border: 1px solid #35506a; background: #071f37; }
.tracking-form label { display: grid; gap: 7px; }
.tracking-form label span { color: #9fb1c4; }
.tracking-form input { border-color: #486078; color: #fff; }
.tracking-form .form-status { color: #8fb8ff; }
.status-summary { background: var(--paper-strong); border-bottom: 1px solid var(--line); }
.status-summary__grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.status-summary article { min-height: 132px; display: flex; flex-direction: column; justify-content: center; padding: 22px; border-right: 1px solid var(--line); }
.status-summary article:last-child { border-right: 0; }
.status-summary span { color: var(--blue); font: 600 .59rem "IBM Plex Mono", monospace; text-transform: uppercase; }
.status-summary strong { margin: 10px 0 4px; font: 700 1.28rem "Archivo Narrow", sans-serif; text-transform: uppercase; }
.status-summary small { color: var(--signal); font-size: .58rem; }
.shipment-control__grid { display: grid; grid-template-columns: 1.25fr .75fr .75fr; gap: 22px; }
.shipment-control__grid > article { min-width: 0; border: 1px solid var(--line); background: var(--paper-strong); }
.shipment-map { display: grid; grid-template-rows: minmax(360px, 1fr) auto; }
.shipment-map > div:last-child { display: grid; grid-template-columns: auto 1fr; gap: 8px 22px; padding: 22px; }
.shipment-map span { color: var(--ink-soft); font: 600 .58rem "IBM Plex Mono", monospace; text-transform: uppercase; }
.shipment-map strong { font-size: .68rem; }
.milestone-ledger, .document-ledger { padding: 22px; }
.milestone-ledger > div,
.document-ledger > div { display: grid; grid-template-columns: 30px 1fr; gap: 3px 10px; padding: 14px 0; border-top: 1px solid var(--line); }
.milestone-ledger > div > span,
.document-ledger .dashicons { grid-row: 1 / 3; color: var(--blue); }
.milestone-ledger strong,
.document-ledger strong { font-size: .68rem; }
.milestone-ledger small,
.document-ledger small { color: var(--ink-soft); font-size: .59rem; }
.tracking-support { background: var(--navy); color: #fff; }
.tracking-support__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 70px; }
.tracking-support h2 { color: #fff; }
.tracking-support p { color: #aebfd0; }
.tracking-support ul { list-style: none; margin: 30px 0 0; padding: 0; border-top: 1px solid #35506a; }
.tracking-support li { padding: 12px 0; border-bottom: 1px solid #35506a; color: #cbd7e2; font-size: .7rem; }

.plan-intro { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); margin: 32px 0 0; padding: 0; border-top: 1px solid var(--line); }
.plan-intro li { padding: 12px 10px 12px 0; border-bottom: 1px solid var(--line); color: var(--ink); font-size: .67rem; font-weight: 700; text-transform: uppercase; }
.plan-intro li:nth-child(odd) { border-right: 1px solid var(--line); }
.plan-intro li:nth-child(even) { padding-left: 12px; }
.plan-intro span { margin-right: 10px; color: var(--blue); font: 600 .57rem "IBM Plex Mono", monospace; }
.plan-intro .plan-intro__icon { width: 16px; height: 16px; margin-right: 7px; font: 16px/1 dashicons; }
.next-steps ol,
.contact-process ol { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; border-top: 1px solid var(--line); }
.next-steps li,
.contact-process li { min-height: 230px; padding: 24px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.next-steps li:last-child,
.contact-process li:last-child { border-right: 0; }
.next-steps li > span,
.contact-process li > span { color: var(--blue); font: 600 .62rem "IBM Plex Mono", monospace; }
.next-steps h3,
.contact-process h3 { margin: 64px 0 14px; }
.next-steps p,
.contact-process p { font-size: .69rem; }
.planning-support { background: var(--paper-blue); }
.planning-support__grid { display: grid; grid-template-columns: minmax(0, 35%) minmax(0, 1fr); gap: 70px; }
.faq-list-compact details { border-top: 1px solid var(--line); }
.faq-list-compact details:last-child { border-bottom: 1px solid var(--line); }
.faq-list-compact summary { min-height: 68px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; list-style: none; font-size: .72rem; font-weight: 700; }
.faq-list-compact summary::-webkit-details-marker { display: none; }
.faq-list-compact details[open] .dashicons { transform: rotate(45deg); }
.faq-list-compact p { padding-right: 30px; font-size: .7rem; }

.people-section { background: var(--paper-strong); }
.people-section__grid { display: grid; grid-template-columns: minmax(0, 32%) minmax(0, 1fr); gap: 60px; }
.people-section__cards { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); }
.people-section__cards article { min-height: 210px; padding: 24px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.people-section__cards article:nth-child(even) { border-right: 0; }
.people-section__cards span { color: var(--blue); font: 600 .61rem "IBM Plex Mono", monospace; }
.people-section__cards h3 { margin: 65px 0 14px; }
.people-section__cards small { color: var(--signal); font-size: .58rem; text-transform: uppercase; }
.verification-callout { padding: 105px 0; background: var(--blue); color: #fff; }
.verification-callout h2 { max-width: 900px; color: #fff; }
.verification-callout p { max-width: 650px; margin: 26px 0; color: #dce8ff; }
.verification-callout .eyebrow { color: #c7daff; }
.verification-callout .button { background: #fff; color: #071524; }

.intent-section { background: var(--paper-blue); }
.intent-cards { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
.intent-cards article { min-height: 290px; padding: 30px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.intent-cards article:last-child { border-right: 0; }
.intent-cards > article > .dashicons { width: 34px; height: 34px; color: var(--blue); font-size: 34px; }
.intent-cards h3 { margin: 60px 0 12px; font-size: 1.65rem; }
.intent-cards p { font-size: .72rem; }
.intent-cards a { display: inline-block; margin-top: 24px; color: var(--blue); font-size: .67rem; font-weight: 700; text-transform: uppercase; }
.contact-methods { background: var(--paper-blue); }
.contact-methods__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; }
.contact-methods dl { margin: 0; border-top: 1px solid var(--line); }
.contact-methods dl div { display: flex; justify-content: space-between; gap: 25px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.contact-methods dt { color: var(--ink-soft); font: 600 .61rem "IBM Plex Mono", monospace; text-transform: uppercase; }
.contact-methods dd { color: var(--signal); font-size: .64rem; font-weight: 700; text-transform: uppercase; }

@media (max-width: 980px) {
  .corridor-filters { grid-template-columns: repeat(2, 1fr); }
  .corridor-cards { grid-template-columns: repeat(2, 1fr); }
  .corridor-cards article:nth-child(even) { border-right: 0; }
  .corridor-enquiry__layout,
  .track-hero__grid,
  .people-section__grid,
  .planning-support__grid { grid-template-columns: 1fr; }
  .track-hero__grid > div:first-child { padding: 70px 0 52px; }
  .track-hero figure { min-height: 460px; }
  .shipment-control__grid { grid-template-columns: 1fr 1fr; }
  .shipment-map { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .corridor-filters,
  .corridor-cards,
  .corridor-enquiry form,
  .status-summary__grid,
  .shipment-control__grid,
  .tracking-support__grid,
  .next-steps ol,
  .contact-process ol,
  .people-section__cards,
  .intent-cards,
  .contact-methods__grid { grid-template-columns: 1fr; }
  .corridor-filters { padding: 16px; }
  .corridor-cards article,
  .intent-cards article { border-right: 0; min-height: 245px; }
  .corridor-cards h2 { margin-top: 58px; }
  .corridor-enquiry__layout { gap: 38px; }
  .track-hero { padding-top: 0; }
  .track-hero__grid > div:first-child { padding: 54px 0 42px; }
  .track-hero h1 { font-size: clamp(4rem, 20vw, 5rem); }
  .track-hero figure { min-height: 340px; }
  .tracking-form { padding: 15px; }
  .status-summary article { min-height: 105px; border-right: 0; border-bottom: 1px solid var(--line); }
  .shipment-map { grid-column: auto; grid-template-rows: 300px auto; }
  .tracking-support__grid { gap: 48px; }
  .next-steps li,
  .contact-process li { min-height: 190px; border-right: 0; }
  .people-section__cards article { border-right: 0; min-height: 185px; }
  .intent-cards h3 { margin-top: 42px; }
}

/* Keep operational cards inside their shell even when editable type grows. */
.capability-index__grid {
  min-width: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.capability-index__grid article { min-width: 0; }
@media (min-width: 1181px) {
  .capability-index__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .capability-index__grid { grid-template-columns: minmax(0, 1fr); }
}

/* Preserve the existing bare-link layout when WordPress owns menu content. */
.tpi-wp-menu,
.tpi-wp-menu > li {
  display: contents;
}

/* Readable Kinetic type tiers. Font families, weights and tracking remain the
 * design signature; only undersized text is lifted to its semantic floor. */
.family-kinetic {
  --kinetic-type-reading: 16px;
  --kinetic-type-support: 14px;
  --kinetic-type-meta: 12px;
}

.family-kinetic :is(
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea
) {
  font-size: var(--kinetic-type-reading) !important;
}

.family-kinetic :is(
  .kinetic-hero__content,
  .faq
) :is(p:not(.eyebrow), .elementor-tab-content) {
  font-size: var(--kinetic-type-reading) !important;
}

.family-kinetic :is(
  .journey__rail,
  .capability-index__grid,
  .compliance__ledger,
  .sustainability__items,
  .corridor-cards,
  .corridor-selector__grid,
  .expertise-kinetic__grid,
  .intent-cards,
  .faq-list-compact,
  .next-steps,
  .contact-process
) p,
.family-kinetic :is(
  .quote-section__layout > aside,
  .tracking-support,
  .kinetic-checks,
  .plan-intro
) li,
.family-kinetic :is(
  .form-grid label > span,
  .corridor-filters label > span,
  .corridor-enquiry form label > span,
  .tracking-form label > span,
  .checkbox-field span,
  .upload-field small,
  .form-footnote,
  .form-status
),
.family-kinetic :is(
  .text-link,
  .button,
  .header-enquiry,
  .tpi-native-button .elementor-button,
  .modes-rail__inner > a,
  .modes-rail__inner > .elementor-widget-text-editor > a,
  .modes-rail__inner > .elementor-widget-text-editor > .elementor-widget-container > a,
  .corridor-cards a,
  .intent-cards a,
  .faq summary,
  .faq-list-compact summary,
  .elementor-tab-title
),
.family-kinetic :is(
  .corridor-focus__copy dd,
  .corridor-focus__copy .tpi-native-tag-dd,
  .contact-methods dd,
  .contact-card > span,
  .contact-card .elementor-widget-text-editor > span,
  .contact-card .elementor-widget-container > span,
  .shipment-map strong,
  .milestone-ledger strong,
  .document-ledger strong
) {
  font-size: var(--kinetic-type-support) !important;
}

.family-kinetic .modes-rail strong {
  font-size: var(--kinetic-type-reading) !important;
}

.family-kinetic main :is(.eyebrow, dt, figcaption, small),
.family-kinetic :is(
  .primary-navigation__track small,
  .demo-label,
  .journey__number,
  .capability-index__number,
  .kinetic-hero__proofs span,
  .modes-rail article span:not(.dashicons),
  .corridor-cards article > span,
  .corridor-cards article .elementor-widget-text-editor > span,
  .corridor-cards article .elementor-widget-container > span,
  .status-summary span,
  .shipment-map span,
  .compliance__ledger span,
  .sustainability__items article span,
  .people-section__cards article span,
  .corridor-selector__grid article span,
  .expertise-kinetic__grid article span,
  .plan-intro span,
  .next-steps li span,
  .next-steps .tpi-native-tag-li span,
  .contact-process li span,
  .contact-process .tpi-native-tag-li span,
  .contact-card span strong,
  .trust-strip span
) {
  font-size: var(--kinetic-type-meta) !important;
}

/* Form guidance is actionable copy, not decorative metadata. */
.family-kinetic :is(
  .form-grid label > span,
  .corridor-filters label > span,
  .corridor-enquiry form label > span,
  .tracking-form label > span,
  .checkbox-field span,
  .upload-field small,
  .form-footnote,
  .form-status
) {
  font-size: var(--kinetic-type-support) !important;
}

@media (max-width: 620px) {
  .family-kinetic .plan-intro > li,
  .family-kinetic .plan-intro > .tpi-native-tag-li {
    white-space: normal;
  }

  .family-kinetic :is(.contact-methods dd, .contact-card > span) {
    min-width: 0;
    overflow-wrap: anywhere;
  }
}

/* Legal brand subtitle remains a separate editable Text Editor widget. */
.family-kinetic .site-footer .rev-legal { font-size:13px; line-height:1.6; max-width:36ch; }
.family-kinetic .site-footer .rev-legal p { font-size:inherit; line-height:inherit; margin:12px 0; }
