/* ==========================================================================
   ETG homepage — agent s2 sections: problems, process, case-studies, industries
   All selectors prefixed .hp-*  (shared heading classes use .hp-s2-* to avoid
   clashing with other agents' .hp-head / .hp-h2 / .hp-lead)
   ========================================================================== */
.hp-problems, .hp-process, .hp-cases, .hp-industries {
  --hp-navy: #082238; --hp-body: #334155; --hp-muted: #64748B; --hp-line: #E2E8F0; --hp-soft: #F3F7F9;
  --hp-g1: #1D3F8F; --hp-g2: #00A3D9; --hp-g3: #00B2A9; --hp-g4: #3FB97A;
  --hp-d3: #08776F; --hp-link: #0A6FA8;
  --hp-grad: linear-gradient(100deg, #1D3F8F 0%, #00A3D9 36%, #00B2A9 68%, #3FB97A 100%);
  --hp-grad-d: linear-gradient(100deg, #1A3A86 0%, #0A6FA8 36%, #08776F 68%, #2E7D3A 100%);
  --hp-ease: cubic-bezier(.2,.7,.1,1);
  position: relative; color: var(--hp-body); font-family: var(--f-body);
  padding-block: clamp(72px, 9vw, 128px); overflow: hidden;
}
.hp-problems { background: #fff; }
.hp-process { background: var(--hp-soft); }
.hp-cases { background: #fff; }
.hp-industries { background: var(--hp-soft); }
.hp-problems .wrap, .hp-process .wrap, .hp-cases .wrap, .hp-industries .wrap { position: relative; z-index: 1; }

/* shared heading */
.hp-s2-head { max-width: 760px; margin-bottom: clamp(36px, 5vw, 56px); }
.hp-s2-head--center { margin-inline: auto; text-align: center; }
.hp-s2-kicker { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px; font: 600 13px/1.2 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--hp-d3); }
.hp-s2-kicker::before { content: ""; width: 26px; height: 3px; border-radius: 2px; background: var(--hp-grad); }
.hp-s2-h2 { margin: 0 0 16px; font: 700 clamp(32px, 1.2rem + 1.9vw, 48px)/1.1 var(--f-display); letter-spacing: -.025em; color: var(--hp-navy); text-transform: none; }
.hp-s2-grad { background: var(--hp-grad-d); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.hp-s2-lead { margin: 0; font: 400 clamp(17px, 1rem + .2vw, 18px)/1.6 var(--f-body); color: var(--hp-body); }
.hp-s2-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* reveal */
.hp-js [data-hp-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .6s var(--hp-ease), transform .6s var(--hp-ease); }
.hp-js [data-hp-reveal].is-in { opacity: 1; transform: none; }

/* ---------- PROBLEMS (pain → fix cards) ---------- */
.hp-problems__glow { position: absolute; inset: -20% -10% auto auto; width: 620px; height: 620px; border-radius: 50%; background: radial-gradient(circle, rgba(0,163,217,.10), rgba(0,178,169,.06) 45%, transparent 70%); pointer-events: none; will-change: transform; }
.hp-problems__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hp-pfix { display: flex; flex-direction: column; border-radius: 18px; border: 1px solid var(--hp-line); background: #fff; overflow: hidden; box-shadow: 0 1px 2px rgba(8,34,56,.04), 0 18px 40px -30px rgba(8,34,56,.3); transition: transform .35s var(--hp-ease), box-shadow .35s, border-color .35s; }
.hp-pfix:hover { transform: translateY(-3px); border-color: #CFE2EE; box-shadow: 0 26px 48px -30px rgba(10,111,168,.45); }
.hp-pfix__pain { position: relative; padding: 22px 24px 26px; background: linear-gradient(180deg, #FFF8F6, #FFF3F0); border-bottom: 1px dashed #F3D4CC; }
.hp-pfix__pain::after { content: "↓"; position: absolute; right: 24px; bottom: -15px; z-index: 1; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--hp-grad); color: #fff; font: 700 15px/1 var(--f-body); box-shadow: 0 6px 14px -6px rgba(10,111,168,.6); }
.hp-pfix__q { margin: 10px 0 0; font: 600 19px/1.35 var(--f-display); letter-spacing: -.01em; color: var(--hp-navy); }
.hp-pfix__fix { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 26px 24px 22px; }
.hp-pfix__fix > p { margin: 0; font-size: 16px; line-height: 1.55; }
.hp-pfix__fix > .hp-pfix__t { margin-top: 4px; font: 700 18px/1.3 var(--f-display); color: var(--hp-navy); }
.hp-pfix__tag { display: inline-block; padding: 5px 10px; border-radius: 999px; font: 700 11px/1 var(--f-body); letter-spacing: .07em; text-transform: uppercase; background: #FFE4DD; color: #A62D19; }
.hp-pfix__tag--fix { align-self: flex-start; background: #DDF4EF; color: #08665F; }
.hp-pfix__link { margin-top: auto; padding-top: 6px; font: 600 15px/1.3 var(--f-body); color: var(--hp-link); text-decoration: none; }
.hp-pfix__link:hover { text-decoration: underline; }
.hp-pfix__link:focus-visible { outline: 2px solid var(--hp-g2); outline-offset: 2px; border-radius: 4px; }
.hp-pfix--flagship { border-color: transparent; box-shadow: 0 0 0 1.5px rgba(0,178,169,.6), 0 22px 44px -26px rgba(8,119,111,.45); }
.hp-pfix--flagship .hp-pfix__fix { background: linear-gradient(160deg, #fff 45%, #EAF7F2); }

.hp-problems__cta { margin-top: 36px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; padding: 22px 26px; border-radius: 18px; background: var(--hp-soft); border: 1px solid var(--hp-line); }
.hp-problems__cta p { margin: 0; font: 600 17px/1.4 var(--f-display); color: var(--hp-navy); }

/* ---------- PROCESS (4 phases / 9 steps) ---------- */
.hp-process__track { position: relative; --hp-p: 0; }
.hp-process__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; position: relative; }
.hp-process__rail { position: absolute; left: 12.5%; right: 12.5%; top: 26px; height: 3px; border-radius: 3px; background: var(--hp-line); overflow: hidden; }
.hp-process__fill { position: absolute; inset: 0; transform-origin: left center; transform: scaleX(var(--hp-p)); background: var(--hp-grad); }
.hp-phase { display: flex; flex-direction: column; align-items: center; gap: 18px; }
.hp-phase__dot { position: relative; z-index: 1; display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: #fff; border: 1.5px solid var(--hp-line); font: 800 20px/1 var(--f-display); color: #94A3B8; transition: color .45s, border-color .45s, box-shadow .45s, transform .45s var(--hp-ease), background .45s; }
.hp-phase.is-lit .hp-phase__dot { color: #fff; border-color: transparent; background: var(--hp-grad); box-shadow: 0 10px 24px -10px rgba(0,163,217,.6); transform: scale(1.06); }
html:not(.hp-js) .hp-phase__dot { color: var(--hp-link); border-color: #BFE3F5; }
.hp-phase__card { align-self: stretch; flex: 1; display: flex; flex-direction: column; gap: 14px; padding: 24px 22px; border-radius: 18px; border: 1px solid var(--hp-line); background: #fff; box-shadow: 0 1px 2px rgba(8,34,56,.04), 0 18px 40px -30px rgba(8,34,56,.3); }
.hp-phase--key .hp-phase__card { border-color: transparent; box-shadow: 0 0 0 1.5px rgba(0,163,217,.55), 0 24px 48px -28px rgba(10,111,168,.5); }
.hp-phase__n { margin: 0; font: 700 12px/1 var(--f-body); letter-spacing: .1em; text-transform: uppercase; color: var(--hp-d3); }
.hp-phase__t { margin: -4px 0 0; font: 700 21px/1.25 var(--f-display); letter-spacing: -.015em; color: var(--hp-navy); }
.hp-phase__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.hp-phase__steps li { display: flex; align-items: center; gap: 10px; font: 500 15px/1.35 var(--f-body); color: var(--hp-body); }
.hp-phase__steps span { flex: none; display: grid; place-items: center; min-width: 30px; height: 24px; padding: 0 6px; border-radius: 7px; background: var(--hp-soft); border: 1px solid var(--hp-line); font: 700 12px/1 var(--f-display); color: var(--hp-muted); }
.hp-phase__promise { margin-top: auto; padding: 16px 16px 15px; border-radius: 14px; background: linear-gradient(140deg, #F0F7FD, #EEF8F3); border: 1px solid #D6EAF2; }
.hp-phase__promise > p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--hp-body); }
.hp-phase__promise > .hp-phase__pt { position: relative; margin-bottom: 8px; padding-left: 28px; font: 700 16px/1.3 var(--f-display); color: var(--hp-navy); }
.hp-phase__pt::before { content: ""; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--hp-grad) ; -webkit-mask: none; }
.hp-phase__pt::after { content: ""; position: absolute; left: 6px; top: 4px; width: 5px; height: 9px; border: solid #fff; border-width: 0 2.2px 2.2px 0; transform: rotate(45deg); }
.hp-phase__checks, .hp-phase__seq { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.hp-phase__checks li { position: relative; padding-left: 24px; font: 500 15px/1.4 var(--f-body); color: var(--hp-navy); }
.hp-phase__checks li::before { content: ""; position: absolute; left: 2px; top: 3px; width: 15px; height: 15px; border-radius: 50%; background: #D7F0E7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B8A7B' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/9px no-repeat; }
.hp-phase__seq { counter-reset: hpseq; }
.hp-phase__seq li { position: relative; padding-left: 28px; font: 400 15px/1.4 var(--f-body); color: var(--hp-body); counter-increment: hpseq; }
.hp-phase__seq li::before { content: counter(hpseq); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; background: #fff; border: 1.5px solid #9CCDE8; font: 700 11px/1 var(--f-display); color: var(--hp-link); }
.hp-phase__seq strong { color: var(--hp-navy); font-weight: 600; }
.hp-process__foot { margin: 40px 0 0; text-align: center; font: 500 16px/1.5 var(--f-body); color: #5B6B7F; }
.hp-process__foot a { font-weight: 600; color: var(--hp-link); text-decoration: none; margin-left: 6px; white-space: nowrap; }
.hp-process__foot a:hover { text-decoration: underline; }

/* ---------- CASE STUDIES (2 cards) ---------- */
.hp-cases__glow { position: absolute; left: -12%; bottom: -25%; width: 640px; height: 640px; border-radius: 50%; background: radial-gradient(circle, rgba(63,185,122,.08), rgba(0,163,217,.06) 45%, transparent 70%); pointer-events: none; will-change: transform; }
.hp-cases__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.hp-case { position: relative; display: flex; flex-direction: column; gap: 18px; padding: 30px 30px 28px; border-radius: 20px; border: 1px solid var(--hp-line); background: #fff; box-shadow: 0 30px 60px -44px rgba(8,34,56,.35); overflow: hidden; }
.hp-case::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--hp-grad); }
.hp-case__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 18px; }
.hp-case__logo { display: block; width: auto; max-width: 170px; height: 46px; object-fit: contain; object-position: left center; }
.hp-case__logo--sq { height: 62px; max-width: 130px; }
.hp-case__ind { margin: 0; padding: 6px 11px; border-radius: 999px; background: var(--hp-soft); border: 1px solid var(--hp-line); font: 600 12.5px/1.2 var(--f-body); color: #1E3A5F; }
.hp-case__title { margin: 0; font: 700 clamp(21px, 1rem + .55vw, 25px)/1.28 var(--f-display); letter-spacing: -.015em; color: var(--hp-navy); }
.hp-case__rows { margin: 0; display: grid; gap: 12px; }
.hp-case__rows div { display: grid; grid-template-columns: 118px 1fr; gap: 12px; }
.hp-case__rows dt, .hp-case__oh { margin: 0; padding-top: 3px; font: 700 12px/1.3 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--hp-d3); }
.hp-case__rows dd { margin: 0; font-size: 16px; line-height: 1.55; }
.hp-case__stack { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hp-case__stack li { display: grid; place-items: center; height: 40px; padding: 0 10px; border-radius: 10px; border: 1px solid var(--hp-line); background: #fff; transition: transform .2s var(--hp-ease), border-color .2s; }
.hp-case__stack li:hover { transform: translateY(-2px); border-color: #94A3B8; }
.hp-case__stack img { display: block; height: 24px; width: auto; max-width: 104px; }
.hp-case__oh { padding: 4px 0 0; margin-bottom: -6px; }
.hp-case__out { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; }
.hp-case__out li { position: relative; padding-left: 28px; font: 500 15.5px/1.45 var(--f-body); color: var(--hp-navy); }
.hp-case__out li::before { content: ""; position: absolute; left: 0; top: 2px; width: 18px; height: 18px; border-radius: 50%; background: #DDF4EF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B8A7B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat; }
.hp-case__link { margin-top: auto; padding-top: 6px; font: 600 15.5px/1.35 var(--f-body); color: var(--hp-link); text-decoration: none; }
.hp-case__link:hover { text-decoration: underline; }
.hp-case__link:focus-visible { outline: 2px solid var(--hp-g2); outline-offset: 2px; border-radius: 4px; }

/* ---------- INDUSTRIES (drill-down) ---------- */
.hp-industries__box { display: grid; gap: 10px; }
.hp-ind { border-radius: 16px; border: 1px solid var(--hp-line); background: #fff; overflow: hidden; transition: border-color .3s, box-shadow .3s; }
.hp-ind.is-open { border-color: #BFDDEF; box-shadow: 0 18px 40px -30px rgba(10,111,168,.5); }
.hp-ind__h { margin: 0; font: inherit; }
.hp-ind__btn { appearance: none; width: 100%; display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 0; background: transparent; cursor: pointer; text-align: left; font: 600 17px/1.25 var(--f-display); color: var(--hp-navy); border-radius: 15px; transition: background .25s; }
.hp-ind__btn:hover { background: #F4F9FD; }
.hp-ind__btn:focus-visible { outline: 2px solid var(--hp-g2); outline-offset: -2px; }
.hp-ind__ico { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: #EEF6FC; color: #0A6FA8; transition: background .3s, color .3s; }
.hp-ind__ico svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.hp-ind__name { flex: 1; }
.hp-ind__count { flex: none; min-width: 26px; padding: 4px 8px; border-radius: 999px; background: var(--hp-soft); border: 1px solid var(--hp-line); font: 700 12px/1 var(--f-body); color: #5B6B7F; text-align: center; }
.hp-ind__chev { flex: none; width: 10px; height: 10px; margin: 0 4px 4px 2px; border: solid #64748B; border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform .3s var(--hp-ease); }
.hp-ind.is-open .hp-ind__chev { transform: rotate(-135deg); margin-bottom: -4px; }
.hp-ind.is-open .hp-ind__ico { background: var(--hp-grad); color: #fff; }
.hp-ind.is-open .hp-ind__count { background: #DDF4EF; border-color: #BFE6D8; color: #08665F; }
.hp-ind__panel { padding: 4px 18px 20px; }
.hp-ind__panel[hidden] { display: none; }
.hp-ind__panel.is-anim { animation: hp-ind-in .4s var(--hp-ease); }
@keyframes hp-ind-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.hp-ind__ptitle { display: none; }
.hp-ind__line { margin: 0 0 10px; font-size: 16.5px; line-height: 1.55; color: var(--hp-body); }
.hp-ind__pl { margin: 0 0 16px; font: 600 14px/1.5 var(--f-body); color: var(--hp-link); }
.hp-ind__pl span { display: block; margin-bottom: 2px; font: 700 11px/1.2 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--hp-muted); }
.hp-ind__subs { list-style: none; margin: 0 0 14px; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.hp-ind__subs a { display: flex; align-items: center; justify-content: space-between; gap: 8px; height: 100%; box-sizing: border-box; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--hp-line); background: var(--hp-soft); font: 600 15px/1.3 var(--f-body); color: var(--hp-navy); text-decoration: none; transition: border-color .25s, background .25s, transform .25s var(--hp-ease); }
.hp-ind__subs a span { color: #94A3B8; transition: color .25s, transform .25s var(--hp-ease); }
.hp-ind__subs a:hover, .hp-ind__subs a:focus-visible { border-color: #9CCDE8; background: #fff; transform: translateY(-2px); }
.hp-ind__subs a:hover span, .hp-ind__subs a:focus-visible span { color: #0A6FA8; transform: translateX(3px); }
.hp-ind__subs a:focus-visible, .hp-ind__all:focus-visible { outline: 2px solid var(--hp-g2); outline-offset: 2px; }
.hp-ind__all { font: 600 15px/1.3 var(--f-body); color: var(--hp-link); text-decoration: none; }
.hp-ind__all:hover { text-decoration: underline; }
.hp-industries__foot { margin: 28px 0 0; font: 500 16px/1.5 var(--f-body); color: #5B6B7F; }
.hp-industries__foot a { font-weight: 600; color: var(--hp-link); text-decoration: none; white-space: nowrap; }
.hp-industries__foot a:hover { text-decoration: underline; }

/* desktop master–detail: industry list on the left, open panel on the right */
@media (min-width: 1024px) {
  .hp-js .hp-industries__box { grid-template-columns: minmax(300px, 380px) 1fr; grid-template-rows: repeat(11, auto); gap: 8px 28px; align-items: start; }
  .hp-js .hp-ind, .hp-js .hp-ind.is-open { display: contents; }
  .hp-js .hp-ind__h { grid-column: 1; }
  .hp-js .hp-ind__btn { padding: 11px 14px; border: 1px solid var(--hp-line); background: #fff; font-size: 16.5px; transition: background .25s, border-color .25s, box-shadow .25s; }
  .hp-js .hp-ind__btn:hover { border-color: #BFDDEF; background: #F7FBFE; }
  .hp-js .hp-ind.is-open .hp-ind__btn { border-color: #9CCDE8; background: linear-gradient(100deg, #fff 30%, #EEF7FC); box-shadow: 0 14px 30px -22px rgba(10,111,168,.6); }
  .hp-js .hp-ind__ico { width: 36px; height: 36px; }
  .hp-js .hp-ind__chev { transform: rotate(-45deg); margin: 0 4px 0 2px; }
  .hp-js .hp-ind.is-open .hp-ind__chev { transform: rotate(-45deg); border-color: #0A6FA8; margin: 0 4px 0 2px; }
  .hp-js .hp-ind__panel { grid-column: 2; grid-row: 1 / -1; position: sticky; top: 96px; padding: 36px 38px 34px; border-radius: 22px; border: 1px solid #CFE2EE; background: radial-gradient(120% 90% at 100% 0%, rgba(0,163,217,.09), transparent 55%), radial-gradient(90% 80% at 0% 100%, rgba(63,185,122,.07), transparent 60%), #fff; box-shadow: 0 34px 70px -46px rgba(10,111,168,.6); }
  .hp-js .hp-ind__ptitle { display: block; margin: 0 0 10px; font: 700 clamp(26px, 1rem + 1vw, 34px)/1.15 var(--f-display); letter-spacing: -.02em; color: var(--hp-navy); }
  .hp-js .hp-ind__line { font-size: 18px; max-width: 46ch; margin-bottom: 18px; }
  .hp-js .hp-ind__pl { margin-bottom: 24px; }
  .hp-js .hp-ind__subs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 22px; }
  .hp-js .hp-ind__subs a { padding: 16px 18px; font-size: 16px; background: #fff; }
}

@media (min-width: 1181px) {
  .hp-phase__steps { min-height: 126px; align-content: start; }
  .hp-phase__promise { margin-top: 0; flex: 1; }
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1180px) {
  .hp-process__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hp-process__rail { display: none; }
}
@media (max-width: 1023px) {
  .hp-problems__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hp-cases__grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  /* vertical process timeline */
  .hp-process__list { grid-template-columns: 1fr; gap: 22px; }
  .hp-process__rail { display: block; left: 25.5px; right: auto; top: 28px; bottom: 28px; width: 3px; height: auto; }
  .hp-process__fill { transform-origin: top center; transform: scaleY(var(--hp-p)); }
  .hp-phase { flex-direction: row; align-items: flex-start; gap: 14px; }
  .hp-phase__dot { flex: none; width: 52px; height: 52px; font-size: 19px; }
  .hp-phase__card { padding: 20px 18px; }
  .hp-problems__grid { grid-template-columns: 1fr; }
  .hp-problems__cta { padding: 20px; }
  .hp-problems__cta .btn { width: 100%; justify-content: center; }
  .hp-case { padding: 26px 20px 22px; }
  .hp-case__rows div { grid-template-columns: 1fr; gap: 4px; }
  .hp-case__out { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .hp-phase__dot { width: 40px; height: 40px; font-size: 16px; }
  .hp-process__rail { left: 19.5px; top: 22px; bottom: 22px; }
  .hp-phase { gap: 10px; }
  .hp-pfix__pain, .hp-pfix__fix { padding-left: 20px; padding-right: 20px; }
  .hp-pfix__pain::after { right: 20px; }
  .hp-ind__subs { grid-template-columns: 1fr; }
  .hp-ind__btn { padding: 12px 12px; gap: 12px; font-size: 16px; }
  .hp-ind__panel { padding: 2px 14px 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .hp-js [data-hp-reveal] { opacity: 1; transform: none; transition: none; }
  .hp-pfix, .hp-phase__dot, .hp-process__fill, .hp-ind__chev, .hp-ind__subs a, .hp-case__stack li { transition: none; }
  .hp-ind__panel.is-anim { animation: none; }
}

/* ---------- Process v2: all 12 steps visible, each with one plain line ---------- */
.hp-steps { list-style: none; margin: 2px 0 0; padding: 0; display: grid; gap: 4px; position: relative; }
.hp-steps::before { content: ""; position: absolute; left: 15px; top: 18px; bottom: 18px; width: 2px; border-radius: 2px; background: repeating-linear-gradient(180deg, #CFE2EE 0 5px, transparent 5px 9px); }
.hp-step { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 12px; padding: 10px 10px 10px 0; border-radius: 12px; transition: background 260ms; }
.hp-step:hover { background: #F3F8FB; }
.hp-step__n { position: relative; z-index: 1; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #fff; border: 1.5px solid #CFE2EE; font: 700 12.5px/1 var(--f-display); color: #0A6FA8; }
.hp-step__t { margin: 3px 0 2px; font: 700 15.5px/1.3 var(--f-display); color: var(--hp-navy); letter-spacing: -.01em; }
.hp-step__d { margin: 0; font: 400 14.5px/1.5 var(--f-body); color: var(--hp-body); }
.hp-step__tag { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 6px; background: #FFF1CC; color: #7A4B00; font: 600 11px/1.5 var(--f-body); font-style: normal; vertical-align: 2px; white-space: nowrap; }
.hp-step--promise { background: linear-gradient(90deg, rgba(255,184,28,.10), rgba(255,184,28,0) 80%); padding-left: 6px; margin-left: -6px; }
.hp-step--promise .hp-step__n { background: #FFB81C; border-color: #FFB81C; color: #082238; }
.hp-phase__card { gap: 10px; }
@media (min-width: 1181px) { .hp-steps { min-height: 0; } }

/* ---------- Industries v2: story + described sub-industries ---------- */
.hp-ind__story { margin: 0 0 16px; font: 400 15.5px/1.65 var(--f-body); color: var(--hp-body); max-width: 68ch; }
.hp-ind__subs a { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; column-gap: 10px; row-gap: 3px; align-items: start; padding: 13px 14px !important; }
.hp-ind__subs a .hp-ind__sn { grid-column: 1; color: var(--hp-navy); font: 600 15px/1.3 var(--f-body); transform: none !important; }
.hp-ind__subs a .hp-ind__sd { grid-column: 1; color: #5B6B7D; font: 400 13.5px/1.45 var(--f-body); transform: none !important; }
.hp-ind__subs a .hp-ind__arr { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: #64748B; }
.hp-ind__subs a:hover .hp-ind__sd { color: var(--hp-body); }
.hp-ind__subs a:hover .hp-ind__arr { color: #0A6FA8; transform: translateX(3px); }

/* inline product links inside fix cards */
.hp-pf-card__d a { color: #5FD3F3; text-decoration: underline; text-decoration-color: rgba(95,211,243,.35); text-underline-offset: 3px; }
.hp-pf-card__d a:hover { text-decoration-color: currentColor; }
/* case-study testimonial (temporary) */
.hp-quote { margin: 4px 0 18px; padding: 16px 18px; border-radius: 14px; background: linear-gradient(140deg, #F0F7FD, #EEF8F3); border-left: 3px solid #FFB81C; }
.hp-quote blockquote { margin: 0; }
.hp-quote p { margin: 0; font: 500 15.5px/1.55 var(--f-body); color: var(--hp-navy); }
.hp-quote figcaption { margin-top: 8px; font: 500 13px/1.4 var(--f-body); color: #64748B; }
.hp-quote figcaption b { color: var(--hp-navy); }

/* Trust line on case studies / client flows: permission + confidentiality */
.pg-trustnote { display: flex; gap: 10px; align-items: flex-start; margin: 14px 0 0; padding: 10px 14px; border-radius: 12px; background: rgba(0,163,217,.07); border: 1px solid rgba(0,163,217,.18); font: 500 13.5px/1.5 var(--f-body, Inter, sans-serif); color: #334155; max-width: 760px; }
.pg-trustnote svg { flex: none; width: 18px; height: 18px; margin-top: 1px; fill: none; stroke: #0A6FA8; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }