/* ==========================================================================
   Technology & Intelligence — shared kit (.xt-*). Load after assets/css/brand/hub.css
   and before any page stylesheet. Markup comes from partials/tech/kit.php and
   partials/tech/next.php only; pages style their own sections with their own prefix.
   Tokens from core.css :root only; no new colours; no gradients except core mask
   fades; no !important. Works on paper, band--alt and band--ink. For an ink surface
   that is not a band (a dark card or panel), add .xt-on-ink to it.

   Pieces
   • .xt-logo / .xt-logo--word / .xt-lg            one technology mark (svg or wordmark chip)
   • .xt-stack--chips | --tiles | --logos | --row   lists of technologies; .xt-marquee wraps a row
   • .xt-ico (+ .xt-ico--mono)                      24px line icons, accent parts .a / .af
   • .xt-badge--seal | --shield | --hex | --chip    code-built standards badges; .xt-badges grid helper
   • .xt-next                                       the "Keep going" onward aid
   Size hooks: --xt-tile (tile min width), --xt-badge (badge art size), --xt-word (wordmark size).
   ========================================================================== */

/* ---------- logos --------------------------------------------------------- */
.xt-logo{display:inline-block;flex:none;vertical-align:middle;color:inherit}
svg.xt-logo:not([width]){width:1.25em;height:1.25em}
.xt-logo--word{display:inline-flex;align-items:center;height:auto;padding:.28em .6em;border:1px solid var(--line-3);border-radius:var(--r-xs);
  font-family:var(--f);font-size:var(--xt-word,.75rem);font-weight:600;letter-spacing:.02em;line-height:1.2;white-space:nowrap;color:inherit}
.xt-lg{display:inline-flex;align-items:center;gap:.55em;min-width:0;color:var(--ink)}
.xt-lg__n{font-size:var(--t-sm);font-weight:500;line-height:1.3}
.xt-lg--word .xt-lg__n{font-family:var(--f);font-size:var(--t-xs);font-weight:600;letter-spacing:.02em}

/* ---------- stacks -------------------------------------------------------- */
.xt-stack{display:flex;flex-wrap:wrap;gap:8px;list-style:none;min-width:0}
.xt-stack>li{min-width:0}

/* chips: pill, logo + name */
.xt-chip{display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:6px 16px 6px 12px;border:1px solid var(--line);border-radius:var(--r-pill);
  background:var(--paper);color:var(--ink);font-size:var(--t-sm);font-weight:500;line-height:1.25;white-space:nowrap}
.xt-chip__dot{position:relative;width:18px;height:18px;flex:none;border-radius:5px;box-shadow:inset 0 0 0 1px var(--line-3)}
.xt-chip__dot::after{content:"";position:absolute;inset:6px;border-radius:1.5px;background:var(--faint)}
.xt-chip__n{min-width:0;overflow:hidden;text-overflow:ellipsis}

/* tiles: logo on top, name, optional category */
.xt-stack--tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--xt-tile,136px),1fr));gap:10px}
.xt-tile{display:flex;flex-direction:column;align-items:flex-start;gap:16px;height:100%;min-height:122px;padding:18px 16px 16px;border:1px solid var(--line);
  border-radius:var(--r);background:var(--paper);color:var(--ink)}
.xt-tile__mark{display:flex;align-items:center;height:28px}
.xt-tile__dot{position:relative;width:28px;height:28px;flex:none;border-radius:7px;box-shadow:inset 0 0 0 1px var(--line-3)}
.xt-tile__dot::after{content:"";position:absolute;inset:10px;border-radius:2px;background:var(--faint)}
.xt-tile__n{margin-top:auto;font-size:var(--t-sm);font-weight:500;line-height:1.3;overflow-wrap:anywhere}
.xt-tile__c{margin-top:-10px;font-family:var(--f);font-size:.625rem;font-weight:500;letter-spacing:.1em;line-height:1.4;text-transform:uppercase;color:var(--faint)}
@media (max-width:480px){.xt-stack--tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* logos: marks only, quiet until hovered */
.xt-stack--logos{align-items:center;gap:18px clamp(22px,3vw,40px)}
.xt-lo{display:flex;align-items:center;color:var(--txt);transition:color var(--d2) var(--e)}
.xt-lo:hover{color:var(--ink)}

/* row: one line, marquee-ready */
.xt-stack--row{flex-wrap:nowrap;align-items:center;gap:clamp(28px,3.4vw,52px);padding-right:clamp(28px,3.4vw,52px)}
.xt-ri{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;color:var(--ink);font-size:var(--t-body);font-weight:500;line-height:1}
.xt-ri__dot{width:7px;height:7px;flex:none;border-radius:2px;background:var(--faint)}
.xt-marquee{position:relative;overflow:hidden;max-width:100%}
.xt-marquee .mq{animation-play-state:paused}
.xt-marquee.is-live .mq{animation-play-state:running}
.xt-marquee.is-live:hover .mq{animation-play-state:paused}

/* ---------- icons --------------------------------------------------------- */
.xt-ico{display:inline-block;flex:none;vertical-align:middle}
svg.xt-ico:not([width]){width:24px;height:24px}
.xt-ico .a{stroke:var(--blue)}
.xt-ico .af{fill:var(--blue);stroke:none}
.xt-ico--mono .a{stroke:currentColor}
.xt-ico--mono .af{fill:currentColor}

/* ---------- standards badges ----------------------------------------------- */
.xt-badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,264px),1fr));gap:28px clamp(24px,3vw,40px);list-style:none}
.xt-badge{display:inline-flex;align-items:center;gap:16px;min-width:0;max-width:100%;color:var(--ink);text-align:left}
.xt-badge:has(.xt-badge__covers,.xt-badge__apply){align-items:flex-start}
.xt-badge__art{width:var(--xt-badge,64px);height:var(--xt-badge,64px);flex:none;overflow:visible}
.xt-badge__ln{fill:var(--paper);stroke:var(--ink);stroke-width:1.2}
.xt-badge__ln2{fill:none;stroke:var(--line-3);stroke-width:1}
.xt-badge__tk{fill:none;stroke:var(--faint);stroke-width:.8}
.xt-badge__ac{fill:none;stroke:var(--blue);stroke-width:2;stroke-linecap:round}
.xt-badge__mk{font-family:var(--f);font-weight:600;letter-spacing:-.02em;fill:var(--ink)}
.xt-badge__sb{font-family:var(--f);font-size:5.2px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;fill:var(--muted)}
.xt-badge__txt{display:flex;flex-direction:column;gap:4px;min-width:0}
.xt-badge__code{font-family:var(--f);font-size:var(--t-xs);font-weight:600;letter-spacing:.03em;line-height:1.35;color:var(--ink)}
.xt-badge__name{font-size:var(--t-sm);line-height:1.45;color:var(--muted)}
.xt-badge__covers{margin-top:6px;font-size:var(--t-sm);line-height:1.6;color:var(--txt);max-width:52ch}
.xt-badge__apply{margin-top:6px;padding-top:10px;border-top:1px solid var(--line-2);font-size:var(--t-sm);line-height:1.6;color:var(--txt);max-width:52ch}
.xt-badge__apply b{display:block;margin-bottom:4px;font-family:var(--f);font-size:var(--t-lbl);font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--blue-d)}

.xt-badge--chip{display:inline-flex;gap:8px;min-height:30px;padding:5px 12px 5px 9px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--paper)}
.xt-badge__pip{width:12px;height:12px;flex:none;fill:none;stroke:var(--blue);stroke-width:1.2;stroke-linejoin:round}
.xt-badge--chip .xt-badge__code{font-size:var(--t-lbl);font-weight:500;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;line-height:1.3}
@media (max-width:600px){.xt-badge--chip .xt-badge__code{white-space:normal}}

/* ---------- ink surfaces --------------------------------------------------- */
:is(.band--ink,.bdh-card--ink,.xt-on-ink) :is(.xt-lg,.xt-ri,.xt-tile,.xt-chip,.xt-badge){color:var(--on-ink)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-logo--word{border-color:var(--on-ink-line)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) :is(.xt-chip,.xt-tile,.xt-badge--chip){background:var(--on-ink-card);border-color:var(--on-ink-line)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-chip__dot{box-shadow:inset 0 0 0 1px var(--on-ink-line)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-chip__dot::after{background:var(--on-ink-3)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-ri__dot{background:var(--on-ink-3)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-tile__dot{box-shadow:inset 0 0 0 1px var(--on-ink-line)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-tile__dot::after{background:var(--on-ink-3)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-tile__c{color:var(--on-ink-3)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-lo{color:var(--on-ink-2)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-lo:hover{color:var(--on-ink)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-badge__ln{fill:none;stroke:var(--on-ink)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-badge__ln2{stroke:var(--on-ink-line)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-badge__tk{stroke:var(--on-ink-3)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-badge__mk{fill:var(--on-ink)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-badge__sb{fill:var(--on-ink-3)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-badge__code{color:var(--on-ink)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) :is(.xt-badge__name,.xt-badge__covers,.xt-badge__apply){color:var(--on-ink-2)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-badge__apply{border-color:var(--on-ink-line)}
:is(.band--ink,.bdh-card--ink,.xt-on-ink) .xt-badge__apply b{color:var(--on-ink-3)}

/* ---------- "Keep going" onward aid (partials/tech/next.php) ------------- */
.xt-next{position:relative;padding-block:clamp(64px,7vw,112px);border-top:1px solid var(--line-2);background:var(--paper)}
.xt-next__bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:clamp(18px,2vw,26px)}
.xt-next__where{display:flex;align-items:center;gap:14px 18px;flex-wrap:wrap;min-width:0}
.xt-next__path{font-family:var(--f);font-size:var(--t-lbl);font-weight:500;letter-spacing:.06em;color:var(--faint);white-space:nowrap}
.xt-next__path i{font-style:normal;color:var(--line-3);margin-inline:2px}
.xt-next__pos{font-family:var(--f);font-size:var(--t-xs);font-weight:500;letter-spacing:.04em;color:var(--faint);font-variant-numeric:tabular-nums;line-height:1}
.xt-next__pos b{font-weight:600;color:var(--ink)}
.xt-next__pos i{font-style:normal;color:var(--line-3)}

/* ten-step index */
.xt-next__index{margin-bottom:clamp(28px,3.2vw,44px)}
.xt-next__steps{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px;list-style:none}
.xt-next__step a{position:relative;display:flex;flex-direction:column;gap:9px;padding-block:6px 4px;border-radius:4px}
.xt-next__seg{position:relative;display:block;height:3px;overflow:hidden;border-radius:2px;background:var(--line)}
.xt-next__seg::after{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform var(--d3) var(--e)}
.xt-next__num{font-family:var(--f);font-size:var(--t-lbl);font-weight:500;letter-spacing:.06em;line-height:1;color:var(--faint);font-variant-numeric:tabular-nums;transition:color var(--d2) var(--e)}
.xt-next__step.is-past .xt-next__seg{background:var(--line-3)}
.xt-next__step.is-here .xt-next__seg::after{transform:none}
.xt-next__step.is-here .xt-next__num{color:var(--ink);font-weight:600}
.xt-next__step.is-next .xt-next__seg{background:var(--blue-wash-2)}
.xt-next__step.is-next .xt-next__seg::after{background:var(--blue);transform:scaleX(.36)}
.xt-next__step.is-next .xt-next__num{color:var(--blue-d)}
.xt-next__step a:hover .xt-next__seg::after,.xt-next__step a:focus-visible .xt-next__seg::after{transform:none}
.xt-next__step a:hover .xt-next__num,.xt-next__step a:focus-visible .xt-next__num{color:var(--ink)}
.xt-next__tip{position:absolute;left:0;bottom:calc(100% + 6px);z-index:3;padding:6px 10px;border-radius:var(--r-xs);background:var(--ink);color:var(--on-ink);
  font-size:var(--t-xs);font-weight:500;line-height:1.3;white-space:nowrap;opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity var(--d1) var(--e-io),transform var(--d2) var(--e)}
.xt-next__step:nth-child(n+6) .xt-next__tip{left:auto;right:0}
.xt-next__step a:hover .xt-next__tip,.xt-next__step a:focus-visible .xt-next__tip{opacity:1;transform:none}
@media (hover:none){.xt-next__tip{display:none}}

/* cards */
.xt-next__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.3fr);gap:clamp(20px,2.4vw,32px);align-items:stretch}
.xt-next__lbl{font-family:var(--f);font-size:var(--t-lbl);font-weight:500;line-height:1.45;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.xt-next__lbl--next{color:var(--blue-d)}

.xt-next__prev{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0;padding:clamp(24px,2.6vw,36px);border:1px solid var(--line);border-radius:var(--r-xl);
  background:var(--paper);transition:border-color var(--d2) var(--e),background var(--d2) var(--e)}
.xt-next__prev:hover{border-color:var(--line-3);background:var(--paper-2)}
.xt-next__ptop{display:flex;align-items:center;justify-content:space-between;align-self:stretch;margin-bottom:auto}
.xt-next__parrow{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--line);border-radius:50%;font-family:var(--f);font-size:1.25rem;color:var(--blue);
  transition:transform var(--d2) var(--e),border-color var(--d2) var(--e)}
.xt-next__prev:hover .xt-next__parrow{transform:translateX(-4px);border-color:var(--blue-line)}
.xt-next__pico{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--r-sm);background:var(--paper-3);color:var(--ink)}
.xt-next__prev .xt-next__lbl{margin-top:clamp(40px,6vw,96px)}
.xt-next__pt{font-family:var(--f-h);font-size:clamp(1.3rem,1.9vw,1.65rem);font-weight:500;letter-spacing:-.02em;line-height:1.15;color:var(--ink)}
.xt-next__pk{font-size:var(--t-sm);line-height:1.5;color:var(--muted)}

.xt-next__go{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);min-width:0;min-height:clamp(340px,31vw,440px);overflow:hidden;
  border:1px solid var(--line);border-radius:var(--r-xl);background:var(--paper-2);transition:border-color var(--d2) var(--e),box-shadow var(--d2) var(--e)}
.xt-next__go:hover{border-color:var(--line-3);box-shadow:var(--sh-2)}
.xt-next__txt{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:14px;min-width:0;padding:clamp(26px,3.4vw,52px)}
.xt-next__t{font-family:var(--f-h);font-size:clamp(1.75rem,3.3vw,2.85rem);font-weight:500;letter-spacing:-.03em;line-height:1.04;color:var(--ink);text-wrap:balance}
.xt-next__d{font-size:var(--t-sm);line-height:1.65;color:var(--muted);max-width:46ch;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.xt-next__runs{display:flex;align-items:center;gap:12px;margin-top:4px;padding-top:14px;border-top:1px solid var(--line);align-self:stretch;min-width:0}
.xt-next__rk{font-family:var(--f);font-size:var(--t-lbl);font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.xt-next__rl{display:flex;align-items:center;gap:14px;min-width:0;color:var(--txt)}
.xt-next__rlogo{display:flex}
.xt-next__rlogo .xt-logo--word{--xt-word:.625rem;padding:.2em .45em}
.xt-next__cta{display:inline-flex;align-items:center;gap:.55em;margin-top:6px;font-size:var(--t-sm);font-weight:500;color:var(--ink)}
.xt-next__cta i{font-family:var(--f);font-style:normal;color:var(--blue);transition:transform var(--d2) var(--e)}
.xt-next__go:hover .xt-next__cta i{transform:translateX(4px)}

/* photo panel with a technical overlay: corner brackets, a readout and a one-shot scan on hover */
.xt-next__vis{position:relative;min-height:220px;overflow:hidden;background:var(--paper-3);isolation:isolate}
.xt-next__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.84) contrast(1.03);transition:transform 1.1s var(--e)}
.xt-next__vis::after{content:"";position:absolute;inset:0;z-index:1;background:var(--blue-wash);mix-blend-mode:multiply;opacity:.6;pointer-events:none}
.xt-next__go:hover .xt-next__img{transform:scale(1.04)}
.xt-next__frame{position:absolute;inset:clamp(14px,1.6vw,22px);z-index:2;pointer-events:none;transition:inset var(--d3) var(--e)}
.xt-next__frame i{position:absolute;width:18px;height:18px;border-color:var(--on-ink);border-style:solid;border-width:0}
.xt-next__frame i:nth-child(1){left:0;top:0;border-left-width:1.5px;border-top-width:1.5px}
.xt-next__frame i:nth-child(2){right:0;top:0;border-right-width:1.5px;border-top-width:1.5px}
.xt-next__frame i:nth-child(3){right:0;bottom:0;border-right-width:1.5px;border-bottom-width:1.5px}
.xt-next__frame i:nth-child(4){left:0;bottom:0;border-left-width:1.5px;border-bottom-width:1.5px}
.xt-next__go:hover .xt-next__frame{inset:clamp(22px,2.2vw,30px)}
.xt-next__scan{position:absolute;left:0;right:0;top:0;z-index:2;height:1.5px;background:var(--on-ink);opacity:0;transform:translateY(0);pointer-events:none}
.xt-next__go:hover .xt-next__scan{animation:xt-next-scan 1.4s var(--e-io) 1 both}
@keyframes xt-next-scan{0%{opacity:0;transform:translateY(0)}12%{opacity:.8}88%{opacity:.8}100%{opacity:0;transform:translateY(clamp(340px,31vw,440px))}}
.xt-next__read{position:absolute;left:clamp(26px,2.6vw,36px);bottom:clamp(26px,2.6vw,36px);z-index:3;display:inline-flex;align-items:center;gap:8px;max-width:calc(100% - 132px);
  padding:7px 11px 7px 8px;border-radius:var(--r-xs);background:var(--paper);box-shadow:var(--sh-1);font-family:var(--f);font-size:var(--t-lbl);font-weight:500;letter-spacing:.04em;
  color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.xt-next__ico{display:grid;place-items:center;width:22px;height:22px;flex:none;border-radius:5px;background:var(--blue-wash)}
.xt-next__arrow{position:absolute;right:clamp(18px,2vw,28px);bottom:clamp(18px,2vw,28px);z-index:3;display:grid;place-items:center;width:64px;height:64px;overflow:hidden;
  border-radius:50%;background:var(--paper);box-shadow:var(--sh-1);color:var(--blue)}
.xt-next__arrow i{position:absolute;inset:0;border-radius:50%;background:var(--blue);transform:scale(0);transition:transform .45s var(--e)}
.xt-next__arrow b{position:relative;font-family:var(--f);font-size:1.5rem;font-weight:400;line-height:1;transition:color var(--d2),transform var(--d2) var(--e)}
.xt-next__go:hover .xt-next__arrow i{transform:scale(1)}
.xt-next__go:hover .xt-next__arrow b{color:var(--on-ink);transform:translateX(2px)}

@media (max-width:900px){
  .xt-next__in{grid-template-columns:minmax(0,1fr)}
  .xt-next__go{order:-1;grid-template-columns:minmax(0,1fr);min-height:0}
  .xt-next__vis{order:-1;aspect-ratio:16 / 9;min-height:0}
  .xt-next__prev{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:16px;row-gap:6px}
  .xt-next__ptop{grid-row:1 / span 3;margin:0}
  .xt-next__pico{display:none}
  .xt-next__prev .xt-next__lbl{margin-top:0}
}
@media (max-width:560px){
  .xt-next__steps{gap:4px}
  .xt-next__path{display:none}
  .xt-next__arrow{top:auto;bottom:14px;right:14px;width:52px;height:52px}
  .xt-next__read{font-size:.625rem;max-width:calc(100% - 52px)}
  .xt-next__runs{flex-wrap:wrap;row-gap:10px}
  .xt-next__rl{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){.xt-next__go:hover .xt-next__scan{animation:none}}
