.pt-hero.page-hero {
  --pt-ink: #edf4ff;
  background: radial-gradient(ellipse at 18% 30%,#142a51 0,transparent 54%),#080f20;
  padding: clamp(32px,4.2vw,68px) 0 24px;
  color: var(--pt-ink);
  isolation: isolate;
}
.pt-hero.page-hero::before { display: none; }
.pt-hero .pt-layout {
  display: grid;
  grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr);
  align-items: center;
  column-gap: clamp(32px,5vw,84px);
  row-gap: 30px;
}
.pt-hero .pt-copy { min-width: 0; }
.pt-hero.page-hero .pt-copy .breadcrumb {
  color: #a3b5ce !important; font-size: .84rem !important;
  line-height: 1.5 !important; margin: 0 0 24px;
}
.pt-hero .breadcrumb a { color: #bdcde1 !important; }
.pt-hero .pt-copy .eyebrow {
  color: #84dcf7 !important; font-size: .8rem !important; letter-spacing: .09em;
}
.pt-hero.page-hero .pt-copy h1 {
  font-size: clamp(2.65rem,4.25vw,4.65rem) !important;
  line-height: 1.06 !important; letter-spacing: -.049em;
  color: #f7faff !important; margin: .28em 0 .32em; font-weight: 550;
  overflow-wrap: break-word; text-wrap: balance;
}
.pt-hero .pt-copy > p:not(.breadcrumb) {
  color: #c5d4e8 !important; font-size: clamp(1rem,1.27vw,1.18rem) !important;
  line-height: 1.65 !important; margin: 0; max-width: 37em;
}
.pt-hero.page-hero .pt-cta {
  border-radius: 4px; margin-top: 24px; min-height: 47px;
  background: #d73247 !important; border: 1px solid #e44b60 !important;
  color: white !important; padding: 12px 20px; display: inline-flex;
  align-items: center; gap: 14px; font-weight: 650;
}
.pt-hero .pt-cta:hover { background: #b9273a !important; }
.pt-hero .pt-foot {
  grid-column: 1/-1; min-width: 0; border-top: 1px solid #2a3851;
  padding-top: 12px; display: flex; align-items: center; justify-content: space-between;
  column-gap: 24px; flex-wrap: wrap;
}
.pt-hero .pt-foot .service-detail-nav {
  margin: 0; padding: 0; border: 0; gap: 8px 22px;
}
.pt-hero .pt-foot .service-detail-nav a { color: #c7d9f2 !important; font-size: .91rem; }
.pt-hero .pt-foot .service-topics {
  display: flex; flex-wrap: wrap; gap: 6px 12px;
  padding: 0; margin: 0; list-style: none;
}
.pt-hero .pt-foot .service-topics li {
  background: transparent !important; border: 0 !important; padding: 0;
  color: #a0b3cd !important; font-size: .78rem !important;
}
.pt-story {
  --pt-accent: #61dbf3; --pt-muted: #b1c4d9;
  position: relative; margin: 0; min-width: 0; width: 100%;
  background: #091527; color: #eff6ff;
  border: 1px solid #3a4d68; border-radius: 10px;
  overflow: hidden; box-shadow: 0 18px 50px #02071254;
}
.pt-story[data-phase="1"] { --pt-accent: #ffa077; }
.pt-story[data-phase="2"] { --pt-accent: #63e1b5; }
.pt-story .pt-top, .pt-story .pt-evidence { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.pt-story .pt-top {
  padding: 5px 13px 5px 18px; min-height: 44px;
  border-bottom: 1px solid #263951; background: #0e1b2e;
}
.pt-story .pt-label {
  display: inline-flex; gap: 9px; align-items: center; font-weight: 650;
  font-size: .92rem; line-height: 1.4; color: #e1ebfb;
}
.pt-story .pt-label svg { width: 17px; height: 17px; color: #7cd9f0; }
.pt-story .pt-motion {
  width: 40px; height: 38px; display: grid; place-items: center;
  padding: 0; border: 0; border-radius: 5px;
  color: #b8cce3; background: transparent; cursor: pointer;
}
.pt-story .pt-motion:hover { background: #263851; color: #fff; }
.pt-story .pt-motion svg { width: 17px; height: 17px; }
.pt-story .pt-motion[hidden], .pt-story:not(.pt-ready) .pt-picker { display: none; }
.pt-story[data-paused="true"] .pt-pause-glyph,
.pt-story:not([data-paused="true"]) .pt-play-glyph { display: none; }
.pt-story .pt-scene {
  position: relative; height: clamp(205px,17vw,295px);
  overflow: hidden; background: #020d20;
}
.pt-story .pt-hardware {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; display: block; user-select: none;
  -webkit-mask-image: linear-gradient(90deg,transparent 0,#000 18%,#000 82%,transparent 100%);
  mask-image: linear-gradient(90deg,transparent 0,#000 18%,#000 82%,transparent 100%);
}
.pt-story .pt-wires { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.pt-story .pt-rail, .pt-story .pt-packet {
  fill: none; stroke: var(--pt-accent); vector-effect: non-scaling-stroke;
  stroke-width: 1.3; opacity: .63; 
}
.pt-story .pt-rail { stroke-dasharray: 2 3; }
.pt-story .pt-packet { stroke-width: 2.5; stroke-dasharray: 7 93; opacity: .92; animation: pt-transmit 3.2s linear infinite; }
.pt-story .pt-return { animation-delay: -1.4s; }
.pt-story[data-phase="2"] .pt-wire-out { opacity: .16; }
.pt-story[data-phase="2"] .pt-wire-out .pt-packet { display: none; }
.pt-story .pt-stop-cross { opacity: 0; stroke: var(--pt-accent); fill: #091626; }
.pt-story[data-phase="2"] .pt-stop-cross { opacity: 1; }
.pt-story .pt-endpoint {
  position: absolute; top: 50%; transform: translate(-50%,-50%);
  display: grid; justify-items: center; align-content: center; gap: 3px;
  min-width: 68px; max-width: 27%; text-align: center;
  line-height: 1.3; color: #dce9f9;
}
.pt-story .pt-client { left: 14%; }
.pt-story .pt-record { left: 86%; }
.pt-story .pt-endpoint svg {
  width: 34px; height: 34px; display: block; padding: 7px; box-sizing: border-box;
  color: var(--pt-accent); background: #09192d; border: 1px solid #476377; border-radius: 7px;
}
.pt-story .pt-endpoint span { font-size: .79rem; font-weight: 600; text-shadow: 0 2px 4px #020917; }
.pt-story .pt-evidence {
  border-block: 1px solid #253951; min-height: 39px;
  padding: 5px clamp(12px,2vw,23px); background: #0a182b;
  font: 600 .78rem/1.4 ui-monospace,monospace; color: #c4d6ed;
}
.pt-story .pt-status {
  font-family: inherit; color: var(--pt-accent);
  display: inline-flex; align-items: center; gap: 7px;
}
.pt-story .pt-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--pt-accent); }
.pt-story .pt-bottom { padding: 13px clamp(14px,2vw,23px) 18px; }
.pt-story .pt-picker { display: flex; align-items: stretch; gap: 7px; margin-bottom: 14px; }
.pt-story .pt-step {
  flex: 1; appearance: none; font: inherit; font-size: .88rem; line-height: 1.4; font-weight: 600;
  border: 1px solid #34475d; border-radius: 4px; margin: 0; padding: 5px 4px;
  min-height: 36px; cursor: pointer; background: #101f33; color: #c1d2e5;
}
.pt-story .pt-step:hover { border-color: #7495b0; }
.pt-story .pt-step[aria-pressed="true"] { color: var(--pt-accent); border-color: var(--pt-accent); background: #17283c; }
.pt-story .pt-captions { display: grid; align-items: start; }
.pt-story .pt-caption { grid-area: 1/1; visibility: hidden; }
.pt-story .pt-caption[aria-hidden="false"] { visibility: visible; }
.pt-story .pt-caption strong { display: block; color: #f2f7ff; font-size: clamp(1.05rem,1.5vw,1.35rem); line-height: 1.35; }
.pt-story .pt-caption span { display: block; margin-top: 4px; color: #c1d0e2; font-size: .92rem; line-height: 1.55; }
.pt-story :focus-visible, .pt-hero .pt-cta:focus-visible { outline: 3px solid #a7eaff; outline-offset: 2px; }
.pt-story noscript { display: block; padding: 0 16px 16px; font-size: .9rem; line-height: 1.5; }
.pt-story[data-paused="true"] .pt-packet, .pt-story.pt-idle .pt-packet { animation-play-state: paused; }
@keyframes pt-transmit { to { stroke-dashoffset: -100; } }
@media (max-width: 920px) {
  .pt-hero .pt-layout { column-gap: 24px; grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr); }
  .pt-hero.page-hero .pt-copy h1 { font-size: clamp(2.35rem,4.8vw,3.2rem) !important; }
}
@media (max-width: 740px) {
  .pt-hero.page-hero { padding: 22px 0 18px; }
  .pt-hero .pt-layout { grid-template-columns: minmax(0,1fr); row-gap: 21px; }
  .pt-hero.page-hero .pt-copy .breadcrumb { margin: 0 0 12px; }
  .pt-hero.page-hero .pt-copy h1 { max-width: 20ch; font-size: clamp(2.2rem,7.9vw,3.35rem) !important; }
  .pt-hero.page-hero .pt-cta { margin-top: 15px; min-height: 44px; }
  .pt-story .pt-scene { height: clamp(175px,45vw,245px); }
  .pt-story .pt-top { min-height: 40px; padding-left: 13px; }
  .pt-story .pt-endpoint svg { width: 30px; height: 30px; padding: 6px; }
  .pt-story .pt-endpoint span { font-size: .75rem; }
  .pt-story .pt-step { min-height: 42px; }
  .pt-hero .pt-foot { gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .pt-story:not([data-user-play="true"]) .pt-packet { animation: none; }
}
.pt-story .pt-scanner {
  position: absolute; left: 50%; top: 20%; width: clamp(46px,13%,95px); height: 1px;
  margin-left: clamp(-47.5px,-6.5%,-23px); background: #91e8fa;
  box-shadow: 0 0 12px 2px #46c4f5; opacity: .8; pointer-events: none;
  animation: pt-scan 3.2s ease-in-out infinite alternate;
}
.pt-story:not([data-phase="0"]) .pt-scanner { visibility: hidden; }
.pt-story[data-paused="true"] .pt-scanner, .pt-story.pt-idle .pt-scanner { animation-play-state: paused; }
@keyframes pt-scan { to { transform: translateY(65px); } }
@media (prefers-reduced-motion: reduce) {
  .pt-story:not([data-user-play="true"]) .pt-scanner { animation: none; }
}