.page-products{
  --pd-hud:#0E3550;
  --pd-line-soft:rgba(53,230,218,.2);
  --pd-text-soft:#C6DCE6;
  background:var(--abyss);
  color:var(--white);
  font-family:var(--font-body);
}

.page-products p{
  margin:0 0 14px;
  font-size:15.5px;
  line-height:1.8;
}

.page-products .pd-hero{
  position:relative;
  padding:clamp(96px,14vw,152px) 0 clamp(48px,7vw,84px);
  background:
    radial-gradient(120% 100% at 88% -10%,rgba(53,230,218,.16),transparent 60%),
    linear-gradient(180deg,#061826 0%,#082031 68%,#061826 100%);
}

.page-products .pd-hero__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(28px,4vw,48px);
  margin-top:clamp(20px,3vw,36px);
}

.page-products .pd-hero__title{
  font-family:var(--font-head);
  font-weight:800;
  font-size:clamp(2.3rem,6.2vw,4.4rem);
  line-height:.98;
  letter-spacing:-.01em;
  margin:14px 0 0;
  max-width:15em;
}

.page-products .pd-hero__title span{
  display:block;
  color:var(--cyan);
}

.page-products .pd-hero__sub{
  max-width:34em;
  margin-top:20px;
  font-size:clamp(15px,1.5vw,17px);
  line-height:1.8;
  color:var(--pd-text-soft);
}

.page-products .pd-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:26px;
}

.page-products .pd-hero__panel{
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  background:linear-gradient(160deg,rgba(11,44,66,.92),rgba(6,24,38,.62));
  padding:clamp(18px,3vw,26px);
}

.page-products .pd-hero__ticks{
  display:flex;
  gap:5px;
  margin-bottom:18px;
}

.page-products .pd-hero__ticks i{
  display:block;
  flex:1;
  height:16px;
  background:var(--steel);
  border-radius:1px;
}

.page-products .pd-hero__ticks i:nth-child(-n+7){
  background:var(--cyan);
}

.page-products .pd-hero__facts{
  list-style:none;
  margin:0;
  padding:0;
}

.page-products .pd-hero__facts li{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:baseline;
  gap:14px;
  padding:13px 0;
  border-bottom:1px solid rgba(18,64,92,.8);
}

.page-products .pd-hero__facts li:last-child{
  border-bottom:0;
  padding-bottom:0;
}

.page-products .pd-hero__facts .num{
  font-family:var(--font-mono);
  font-size:1.55rem;
  letter-spacing:-.02em;
  line-height:1;
  color:var(--cyan);
}

.page-products .pd-hero__facts small{
  font-size:.5em;
  margin-left:3px;
  color:var(--mist);
}

.page-products .pd-hero__facts li > span:last-child{
  font-size:13.5px;
  line-height:1.5;
  color:var(--mist);
}

.page-products .pd-sec{
  padding:clamp(48px,7vw,96px) 0;
  position:relative;
}

.page-products .pd-sec--console{
  background:linear-gradient(180deg,#0B2C42 0%,#0A2437 100%);
}

.page-products .pd-head{
  display:grid;
  gap:12px;
  margin-bottom:clamp(24px,3.5vw,44px);
}

.page-products .pd-head__num{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.18em;
  line-height:1;
  color:var(--cyan);
  border-left:2px solid var(--cyan);
  padding-left:10px;
}

.page-products .pd-head__title{
  font-family:var(--font-head);
  font-weight:800;
  font-size:clamp(1.7rem,3.7vw,2.75rem);
  line-height:1.06;
  letter-spacing:-.005em;
  margin:0;
}

.page-products .pd-head__sub{
  margin:0;
  max-width:46em;
  color:var(--mist);
  font-size:15.5px;
  line-height:1.8;
}

.page-products .pd-lines{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(20px,3vw,40px);
}

.page-products .pd-rail{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.page-products .pd-rail__link{
  display:grid;
  gap:3px;
  padding:14px 16px 14px 20px;
  border-left:2px solid var(--steel);
  text-decoration:none;
  color:var(--mist);
  transition:border-color .18s var(--ease),background .18s var(--ease),color .18s var(--ease);
}

.page-products .pd-rail__link .num{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--cyan-deep);
}

.page-products .pd-rail__link strong{
  font-family:var(--font-head);
  font-size:1.08rem;
  font-weight:700;
  letter-spacing:.01em;
  color:var(--white);
}

.page-products .pd-rail__link small{
  font-size:12.5px;
  letter-spacing:.02em;
  color:var(--mist);
}

.page-products .pd-rail__link:hover,
.page-products .pd-rail__link:focus-visible,
.page-products .pd-rail__link.is-active{
  border-left-color:var(--cyan);
  background:var(--cyan-veil);
  color:var(--white);
}

.page-products .pd-panel{
  background:var(--console);
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  padding:clamp(20px,3vw,32px);
  scroll-margin-top:96px;
}

.page-products .pd-panel + .pd-panel{
  margin-top:16px;
}

.page-products .pd-panel__k{
  margin:0 0 8px;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.16em;
  color:var(--cyan);
}

.page-products .pd-panel__title{
  font-family:var(--font-head);
  font-weight:700;
  font-size:clamp(1.25rem,2.4vw,1.6rem);
  line-height:1.2;
  margin:0 0 14px;
}

.page-products .pd-panel p{
  color:var(--pd-text-soft);
}

.page-products .pd-panel__split{
  display:grid;
  grid-template-columns:1fr;
  gap:22px;
}

.page-products .pd-dotlist{
  list-style:none;
  margin:16px 0 0;
  padding:0;
  display:grid;
  gap:10px;
}

.page-products .pd-dotlist li{
  position:relative;
  padding-left:18px;
  font-size:14.5px;
  line-height:1.7;
  color:var(--mist);
}

.page-products .pd-dotlist li::before{
  content:"";
  position:absolute;
  left:0;
  top:.68em;
  width:7px;
  height:7px;
  background:var(--cyan);
  border-radius:1px;
}

.page-products .pd-shot{
  position:relative;
  margin:0;
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  overflow:hidden;
  background:#08202f;
}

.page-products .pd-shot img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:cover;
  filter:saturate(.82) contrast(1.05);
}

.page-products .pd-shot::after{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:62%;
  pointer-events:none;
  background:linear-gradient(165deg,rgba(53,230,218,.12),transparent 58%);
}

.page-products .pd-shot__cap{
  display:block;
  padding:10px 14px;
  border-top:1px solid var(--steel);
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.05em;
  color:var(--mist);
  background:rgba(6,24,38,.7);
}

.page-products .pd-shot--wide,
.page-products .pd-shot--pad,
.page-products .pd-shot--flow{
  margin-top:clamp(24px,3.5vw,40px);
}

.page-products .pd-conds{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}

.page-products .pd-cond{
  background:rgba(6,24,38,.55);
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  padding:20px;
}

.page-products .pd-cond__k{
  display:block;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  color:var(--cyan);
  margin-bottom:10px;
}

.page-products .pd-cond h3{
  font-family:var(--font-head);
  font-weight:700;
  font-size:1.25rem;
  margin:0 0 8px;
}

.page-products .pd-cond p{
  margin:0;
  font-size:14.5px;
  line-height:1.75;
  color:var(--mist);
}

.page-products .pd-note{
  margin-top:18px;
  padding:14px 16px;
  border-left:2px solid var(--cyan-deep);
  background:rgba(53,230,218,.07);
  font-size:14px;
  line-height:1.75;
  color:var(--pd-text-soft);
}

.page-products .pd-ticker{
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  background:var(--steel);
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  overflow:hidden;
}

.page-products .pd-ticker__cell{
  background:var(--console);
  padding:20px;
  display:grid;
  gap:8px;
}

.page-products .pd-ticker__cell--now{
  background:linear-gradient(160deg,rgba(53,230,218,.16),rgba(11,44,66,1));
}

.page-products .pd-ticker__cell strong{
  font-family:var(--font-mono);
  font-size:clamp(1.2rem,2.6vw,1.6rem);
  line-height:1.1;
  letter-spacing:-.01em;
  color:var(--white);
}

.page-products .pd-ticker__cell > span:last-child{
  font-size:13.5px;
  line-height:1.6;
  color:var(--mist);
}

.page-products .pd-rounds__body{
  margin-top:clamp(22px,3vw,32px);
  max-width:720px;
}

.page-products .pd-inline-link{
  margin-top:18px;
}

.page-products .pd-inline-link a{
  color:var(--cyan);
  text-decoration:none;
  border-bottom:1px solid var(--pd-line-soft);
  font-size:14.5px;
  padding-bottom:2px;
}

.page-products .pd-inline-link a:hover{
  border-bottom-color:var(--cyan);
}

.page-products .pd-records__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(20px,3vw,32px);
}

.page-products .pd-matrix{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:var(--steel);
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  overflow:hidden;
}

.page-products .pd-matrix__cell{
  background:var(--console);
  padding:18px 16px;
  transition:background .18s var(--ease),box-shadow .18s var(--ease);
}

.page-products .pd-matrix__cell:hover{
  background:var(--cyan-veil);
  box-shadow:inset 0 0 0 1px var(--cyan);
}

.page-products .pd-matrix__k{
  display:block;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.16em;
  color:var(--cyan);
  margin-bottom:8px;
}

.page-products .pd-matrix__cell p{
  margin:0;
  font-size:13.5px;
  line-height:1.7;
  color:var(--mist);
}

.page-products .pd-states{
  list-style:none;
  margin:16px 0 0;
  padding:0;
  display:grid;
  gap:10px;
}

.page-products .pd-state{
  background:var(--console);
  border-left:3px solid var(--steel);
  border-radius:0 var(--radius-card) var(--radius-card) 0;
  padding:14px 16px;
}

.page-products .pd-state--red{
  border-left-color:var(--coral);
}

.page-products .pd-state--yellow{
  border-left-color:var(--signal);
}

.page-products .pd-state--deep{
  border-left-color:var(--cyan-deep);
}

.page-products .pd-state__k{
  display:block;
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.1em;
  color:var(--white);
  margin-bottom:6px;
}

.page-products .pd-state p{
  margin:0;
  font-size:13.5px;
  line-height:1.7;
  color:var(--mist);
}

.page-products .pd-switch{
  display:inline-flex;
  gap:6px;
  padding:5px;
  background:var(--console);
  border:1px solid var(--steel);
  border-radius:999px;
  margin-bottom:22px;
}

.page-products .pd-switch__btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  appearance:none;
  border:0;
  background:transparent;
  color:var(--mist);
  font-family:var(--font-body);
  font-size:13.5px;
  padding:8px 16px;
  border-radius:999px;
  cursor:pointer;
  transition:background .18s var(--ease),color .18s var(--ease);
}

.page-products .pd-switch__btn svg{
  width:16px;
  height:16px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.6;
  stroke-linecap:round;
}

.page-products .pd-switch__btn:hover{
  color:var(--white);
}

.page-products .pd-switch__btn.is-active{
  background:var(--cyan);
  color:#04222A;
}

.page-products .pd-views{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}

.page-products .pd-view{
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  background:var(--console);
  padding:22px 20px;
  transition:border-color .2s var(--ease),background .2s var(--ease);
}

.page-products .pd-view:hover{
  border-color:var(--cyan-deep);
  background:var(--pd-hud);
}

.page-products .pd-view h3{
  font-family:var(--font-head);
  font-weight:700;
  font-size:1.2rem;
  margin:0 0 8px;
}

.page-products .pd-view p{
  margin:0;
  font-size:14.5px;
  line-height:1.75;
  color:var(--mist);
}

.page-products .pd-views__extra{
  margin-top:22px;
  max-width:720px;
}

.page-products .pd-views__extra strong{
  color:var(--cyan);
  font-weight:600;
}

.page-products .pd-specs{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:var(--steel);
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  overflow:hidden;
}

.page-products .pd-spec{
  background:var(--console);
  padding:18px 16px;
}

.page-products .pd-spec__k{
  display:block;
  font-size:11.5px;
  letter-spacing:.14em;
  color:var(--mist);
  margin-bottom:10px;
}

.page-products .pd-spec__v{
  display:block;
  font-family:var(--font-mono);
  font-size:clamp(1.15rem,3vw,1.6rem);
  line-height:1;
  letter-spacing:-.02em;
  color:var(--white);
  word-break:break-word;
}

.page-products .pd-spec__v small{
  font-size:.5em;
  margin-left:5px;
  color:var(--cyan);
  letter-spacing:0;
}

.page-products .pd-steps{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}

.page-products .pd-step{
  display:grid;
  gap:8px;
  background:var(--console);
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  padding:24px 20px;
}

.page-products .pd-step__n{
  font-family:var(--font-mono);
  font-size:34px;
  line-height:1;
  letter-spacing:-.02em;
  color:var(--cyan);
}

.page-products .pd-step h3{
  font-family:var(--font-head);
  font-weight:700;
  font-size:1.22rem;
  margin:0;
}

.page-products .pd-step p{
  margin:0;
  font-size:14.5px;
  line-height:1.75;
  color:var(--mist);
}

.page-products .pd-cta{
  display:grid;
  gap:18px;
  margin-top:clamp(28px,4vw,44px);
  padding:clamp(22px,3.5vw,32px);
  border:1px solid var(--steel);
  border-left:3px solid var(--coral);
  border-radius:var(--radius-card);
  background:linear-gradient(140deg,rgba(255,107,74,.1),rgba(11,44,66,.9));
}

.page-products .pd-cta .label{
  color:var(--coral);
  margin:0 0 8px;
}

.page-products .pd-cta__line{
  margin:0;
  font-size:16px;
  line-height:1.7;
  color:var(--pd-text-soft);
}

.page-products .pd-cta .btn{
  justify-self:start;
}

.page-products .pd-next{
  list-style:none;
  margin:18px 0 0;
  padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}

.page-products .pd-next a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:16px 18px;
  border:1px solid var(--steel);
  border-radius:var(--radius-card);
  text-decoration:none;
  color:var(--white);
  font-size:14.5px;
  transition:border-color .18s var(--ease),background .18s var(--ease);
}

.page-products .pd-next a:hover,
.page-products .pd-next a:focus-visible{
  border-color:var(--cyan);
  background:var(--cyan-veil);
}

.page-products .pd-next .num{
  font-family:var(--font-mono);
  color:var(--cyan);
  font-size:14px;
}

@media (min-width:700px){
  .page-products .pd-conds{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .page-products .pd-views{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .page-products .pd-specs{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .page-products .pd-next{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (min-width:760px){
  .page-products .pd-ticker{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .page-products .pd-matrix{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .page-products .pd-panel__split{
    grid-template-columns:minmax(0,6fr) minmax(0,5fr);
    align-items:center;
  }
}

@media (min-width:820px){
  .page-products .pd-steps{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .page-products .pd-step:nth-child(2){
    margin-top:22px;
  }

  .page-products .pd-step:nth-child(3){
    margin-top:44px;
  }

  .page-products .pd-records__grid{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
    align-items:start;
  }
}

@media (min-width:920px){
  .page-products .pd-lines{
    grid-template-columns:minmax(0,4fr) minmax(0,8fr);
    align-items:start;
  }

  .page-products .pd-rail{
    position:sticky;
    top:88px;
  }
}

@media (min-width:960px){
  .page-products .pd-hero__grid{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
    align-items:end;
  }

  .page-products .pd-cta{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
  }
}
<<<END>>>