/* Ephor product page. Scoped to .ephor so the site theme stays untouched.
   Palette and type follow the Ephor sales kit: navy, paper, rust, IBM Plex Sans + Source Serif 4. */
.ephor {
  --eph-navy: #10233A;
  --eph-paper: #F7F5EF;
  --eph-rust: #A84A0C;
  --eph-orange: #E07A1F;
  --eph-ink: #1E2A3A;
  --eph-text: #2B3645;
  --eph-muted: #4A5566;
  --eph-rule: #D6D0C2;
  --eph-serif: "Source Serif 4", Georgia, serif;
  --eph-sans: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-family: var(--eph-sans);
  color: var(--eph-text);
}
.ephor p, .ephor li, .ephor dd, .ephor td, .ephor th { font-family: var(--eph-sans); }
.ephor h1, .ephor h2 { font-family: var(--eph-serif); font-weight: 600; letter-spacing: -0.01em; color: var(--eph-navy); }
.ephor h3 { font-family: var(--eph-sans); font-weight: 600; color: var(--eph-navy); letter-spacing: 0; }
.ephor h2 { font-size: 40px; line-height: 1.15; margin: 0 0 16px; }
.ephor h3 { font-size: 19px; line-height: 1.35; margin: 0 0 8px; }
.ephor p { font-size: 16px; line-height: 1.65; margin: 0 0 14px; }
.ephor a { color: var(--eph-rust); }
.ephor section.eph-intro,
.ephor section.eph-clock,
.ephor section.eph-caps,
.ephor section.eph-gate,
.ephor section.eph-india,
.ephor section.eph-coverage,
.ephor section.eph-plans,
.ephor section.eph-faq { padding: 88px 0; }

/* Hero */
.ephor #subheader.eph-hero { background: var(--eph-navy); padding: 150px 0 72px; }
.ephor #subheader.eph-hero h1 { font-size: 80px; line-height: 1; margin: 18px 0 20px; color: var(--eph-paper); }
.ephor #subheader.eph-hero .crumb { margin: 0; }
.ephor #subheader.eph-hero .crumb li, .ephor #subheader.eph-hero .crumb a { color: #C9D3E0; }
.ephor .eph-lede { font-size: 21px; line-height: 1.5; color: #E4E9F0; max-width: 34em; margin: 0 0 30px; }
.ephor .eph-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.ephor .eph-btn { display: inline-flex; align-items: center; min-height: 48px; padding: 0 22px; border-radius: 8px; font: 600 16px/1.2 var(--eph-sans); text-decoration: none; }
.ephor .eph-btn-primary { background: var(--eph-orange); color: var(--eph-navy); }
.ephor .eph-btn-primary:hover { background: #EF8A30; color: var(--eph-navy); }
.ephor .eph-btn-quiet { border: 1px solid #8FA0B5; color: var(--eph-paper); }
.ephor .eph-btn-quiet:hover { border-color: var(--eph-paper); color: #fff; }
.ephor .eph-btn:focus-visible, .ephor a:focus-visible { outline: 3px solid var(--eph-orange); outline-offset: 3px; }

/* Answer-first intro */
.ephor .eph-intro { background: var(--eph-paper); }
.ephor .eph-answer { font-size: 20px; line-height: 1.6; color: var(--eph-ink); }
.ephor .eph-facts { margin: 0; border-top: 2px solid var(--eph-navy); }
.ephor .eph-facts div { display: grid; grid-template-columns: 120px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--eph-rule); }
.ephor .eph-facts dt { font-size: 14px; font-weight: 600; color: var(--eph-muted); }
.ephor .eph-facts dd { margin: 0; font-size: 16px; line-height: 1.5; color: var(--eph-navy); }

/* The clock */
.ephor .eph-clock { background: var(--eph-navy); }
.ephor .eph-clock h2 { color: var(--eph-paper); max-width: 18em; }
.ephor .eph-clock .eph-sub { color: #C9D3E0; font-size: 18px; max-width: 40em; margin-bottom: 40px; }
.ephor .eph-chart { margin: 0; }
.ephor .eph-axis, .ephor .eph-row { display: grid; grid-template-columns: minmax(220px, 30%) 1fr; column-gap: 28px; }
.ephor .eph-axis-track { position: relative; height: 34px; }
.ephor .eph-axis .eph-tick { position: absolute; top: 0; height: 34px; transform: translateX(-50%); }
.ephor .eph-axis .eph-tick.eph-first { transform: none; }
.ephor .eph-axis .eph-tick.eph-last { transform: translateX(-100%); }
.ephor .eph-axis .eph-tick span { display: block; font: 500 13px/1 var(--eph-sans); color: #AEBBCB; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ephor .eph-axis .eph-tick::after { content: ""; position: absolute; left: 50%; top: 20px; height: 10px; width: 1px; background: #5C6E85; }
.ephor .eph-axis .eph-tick.eph-first::after { left: 0; }
.ephor .eph-axis .eph-tick.eph-last::after { left: auto; right: 0; }
.ephor .eph-rows { list-style: none; margin: 0; padding: 0; }
.ephor .eph-row { align-items: center; padding: 18px 0; border-top: 1px solid rgba(201, 211, 224, .18); }
.ephor .eph-row-label b { display: block; font: 600 17px/1.3 var(--eph-sans); color: var(--eph-paper); }
.ephor .eph-row-label span { display: block; font-size: 14px; line-height: 1.45; color: #C9D3E0; margin-top: 2px; }
.ephor .eph-row-src { grid-column: 2; font-size: 12.5px; color: #8FA0B5; margin-top: 6px; }
.ephor .eph-track {
  position: relative; height: 16px; border-radius: 8px;
  background:
    linear-gradient(to right, transparent calc(56% - 1px), rgba(247, 245, 239, .45) calc(56% - 1px), rgba(247, 245, 239, .45) calc(56% + 1px), transparent calc(56% + 1px)),
    rgba(255, 255, 255, .07);
}
.ephor .eph-bar { position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); border-radius: 8px; background: var(--eph-orange); transform-origin: left center; }
.ephor .eph-target .eph-bar { background: transparent; border: 2px dashed var(--eph-orange); }
.ephor .eph-open .eph-bar { background: transparent; border: 2px dashed var(--eph-orange); border-right: 0; border-radius: 8px 0 0 8px;
  -webkit-mask-image: linear-gradient(to right, #000 40%, transparent); mask-image: linear-gradient(to right, #000 40%, transparent); }
.ephor .eph-chart figcaption { margin-top: 18px; font-size: 13px; line-height: 1.5; color: #AEBBCB; max-width: 48em; }
.ephor .eph-clock-notes { margin: 36px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ephor .eph-clock-notes li { color: #E4E9F0; font-size: 16px; line-height: 1.55; padding-top: 14px; border-top: 2px solid var(--eph-orange); }
@media (prefers-reduced-motion: no-preference) {
  .ephor .eph-chart.eph-armed .eph-bar { transform: scaleX(0); }
  .ephor .eph-chart.eph-run .eph-bar { transform: scaleX(1); transition: transform 1.1s cubic-bezier(.2, .7, .2, 1); }
  .ephor .eph-chart.eph-run .eph-row:nth-child(2) .eph-bar { transition-delay: .12s; }
  .ephor .eph-chart.eph-run .eph-row:nth-child(3) .eph-bar { transition-delay: .24s; }
  .ephor .eph-chart.eph-run .eph-row:nth-child(4) .eph-bar { transition-delay: .36s; }
}

/* Capabilities */
.ephor .eph-caps { background: #fff; }
.ephor .eph-cap-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 56px; margin-top: 28px; }
.ephor .eph-cap-grid > div { padding: 20px 0 6px; border-top: 1px solid var(--eph-rule); }

/* Approval steps: a real sequence, so it is numbered */
.ephor .eph-gate { background: var(--eph-paper); }
.ephor .eph-steps { list-style: none; counter-reset: step; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.ephor .eph-steps li { counter-increment: step; position: relative; padding-top: 64px; }
.ephor .eph-steps li::before { content: counter(step); position: absolute; top: 0; left: 0; font: 600 44px/1 var(--eph-serif); color: var(--eph-rust); }
.ephor .eph-steps li:not(:last-child)::after { content: ""; position: absolute; top: 22px; left: 48px; right: -28px; height: 2px; background: var(--eph-rule); }
.ephor .eph-note { margin-top: 28px; font-size: 15px; color: var(--eph-muted); }

/* India */
.ephor .eph-india { background: #fff; }
.ephor .eph-list { list-style: none; margin: 0; padding: 0; }
.ephor .eph-list li { position: relative; padding: 14px 0 14px 26px; border-bottom: 1px solid var(--eph-rule); font-size: 16px; line-height: 1.55; color: var(--eph-ink); }
.ephor .eph-list li::before { content: ""; position: absolute; left: 0; top: 22px; width: 10px; height: 10px; background: var(--eph-rust); }

/* Coverage table */
.ephor .eph-coverage { background: var(--eph-paper); }
.ephor .eph-table-wrap { overflow-x: auto; margin-top: 24px; }
.ephor .eph-table { width: 100%; min-width: 560px; border-collapse: collapse; }
.ephor .eph-table th, .ephor .eph-table td { text-align: left; padding: 14px 16px 14px 0; border-bottom: 1px solid var(--eph-rule); font-size: 16px; vertical-align: top; }
.ephor .eph-table thead th { font-size: 14px; font-weight: 600; color: var(--eph-muted); border-bottom: 2px solid var(--eph-navy); }
.ephor .eph-table tbody th { font-weight: 600; color: var(--eph-navy); }
.ephor .eph-table tbody th a { color: var(--eph-navy); text-decoration: underline; text-decoration-color: var(--eph-rule); text-underline-offset: 3px; }

/* Plans */
.ephor .eph-plans { background: #fff; }
.ephor .eph-plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 28px; border-top: 2px solid var(--eph-navy); }
.ephor .eph-plan-grid > div { padding: 22px 28px 8px 0; }
.ephor .eph-plan-grid > div + div { padding-left: 28px; border-left: 1px solid var(--eph-rule); }
.ephor .eph-plan-grid h3 { font: 600 26px/1.2 var(--eph-serif); }

/* FAQ */
.ephor .eph-faq { background: var(--eph-paper); }
.ephor .eph-qa { padding: 22px 0 8px; border-top: 1px solid var(--eph-rule); }
.ephor .eph-qa:first-child { border-top: 2px solid var(--eph-navy); }

@media (max-width: 991px) {
  .ephor h2 { font-size: 32px; }
  .ephor #subheader.eph-hero { padding: 120px 0 56px; }
  .ephor #subheader.eph-hero h1 { font-size: 56px; }
  .ephor section.eph-intro, .ephor section.eph-clock, .ephor section.eph-caps, .ephor section.eph-gate,
  .ephor section.eph-india, .ephor section.eph-coverage, .ephor section.eph-plans, .ephor section.eph-faq { padding: 64px 0; }
  .ephor .eph-cap-grid, .ephor .eph-steps, .ephor .eph-plan-grid, .ephor .eph-clock-notes { grid-template-columns: 1fr; }
  .ephor .eph-steps li:not(:last-child)::after { display: none; }
  .ephor .eph-plan-grid > div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--eph-rule); }
  .ephor .eph-axis, .ephor .eph-row { grid-template-columns: 1fr; }
  .ephor .eph-axis { margin-bottom: 4px; }
  .ephor .eph-axis .eph-tick.eph-minor span { visibility: hidden; }
  .ephor .eph-row-label { margin-bottom: 10px; }
  .ephor .eph-row-src { grid-column: 1; }
}
@media (max-width: 575px) {
  .ephor .eph-lede { font-size: 18px; }
  .ephor .eph-answer { font-size: 18px; }
  .ephor .eph-facts div { grid-template-columns: 1fr; gap: 2px; }
}

/* Ephor band on the home page */
.ephor.eph-home { background: var(--eph-navy); padding: 96px 0; }
.ephor.eph-home h2 { color: var(--eph-paper); font-size: 44px; line-height: 1.12; max-width: 15em; }
.ephor.eph-home .eph-kicker { font-size: 15px; font-weight: 600; color: var(--eph-orange); margin-bottom: 14px; }
.ephor.eph-home .eph-home-lede { font-size: 18px; line-height: 1.6; color: #E4E9F0; max-width: 36em; margin-bottom: 28px; }
.ephor .eph-mini { margin: 0; }
.ephor .eph-mini div { padding: 18px 0; border-top: 1px solid rgba(201, 211, 224, .22); }
.ephor .eph-mini div:first-child { border-top: 2px solid var(--eph-orange); }
.ephor .eph-mini dt { font: 600 34px/1.1 var(--eph-serif); color: var(--eph-paper); font-variant-numeric: tabular-nums; }
.ephor .eph-mini dd { margin: 6px 0 0; font-size: 15px; line-height: 1.5; color: #C9D3E0; }
@media (max-width: 991px) {
  .ephor.eph-home { padding: 64px 0; }
  .ephor.eph-home h2 { font-size: 34px; }
}

/* Closing call to action on the orange band: navy text keeps contrast on orange */
.ephor .eph-cta h3, .ephor .eph-cta p { color: var(--eph-navy); }
.ephor .eph-btn-navy { background: var(--eph-navy); color: var(--eph-paper); }
.ephor .eph-btn-navy:hover { background: #1B3554; color: #fff; }
