/* INFOTECH 3.10UX1 — concise onboarding blocks for primary tools */
.infotech-howto-310ux1{
  margin: clamp(18px, 3vw, 34px) 0;
  padding: clamp(18px, 2.8vw, 28px);
  border: 1px solid rgba(64, 224, 255, .26);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(4,18,36,.78), rgba(10,10,28,.68));
  box-shadow: 0 22px 80px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.035);
  position: relative;
  overflow: hidden;
}
.infotech-howto-310ux1::before{
  content:"";
  position:absolute;
  inset:-1px;
  pointer-events:none;
  background: radial-gradient(circle at 12% 0%, rgba(0,214,255,.18), transparent 34%), radial-gradient(circle at 90% 10%, rgba(255,43,214,.10), transparent 28%);
}
.infotech-howto-310ux1 > *{position:relative; z-index:1;}
.infotech-howto-310ux1 .howto-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}
.infotech-howto-310ux1 .howto-kicker{
  margin:0 0 6px;
  color:#7ee8ff;
  font-size:.78rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:800;
}
.infotech-howto-310ux1 h2{
  margin:0;
  font-size:clamp(1.25rem, 2.3vw, 2rem);
  line-height:1.12;
  color:#f7fbff;
}
.infotech-howto-310ux1 .howto-note{
  max-width:420px;
  margin:0;
  color:rgba(225,238,255,.78);
  font-size:.94rem;
  line-height:1.55;
}
.infotech-howto-310ux1 .howto-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}
.infotech-howto-310ux1 .howto-step{
  min-height:132px;
  padding:16px;
  border:1px solid rgba(125, 232, 255, .16);
  border-radius:18px;
  background:rgba(255,255,255,.045);
  backdrop-filter: blur(8px);
}
.infotech-howto-310ux1 .howto-num{
  display:inline-grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:12px;
  margin-bottom:12px;
  color:#001521;
  background:linear-gradient(135deg, #7ee8ff, #ffffff);
  font-weight:900;
}
.infotech-howto-310ux1 .howto-title{
  margin:0 0 8px;
  color:#ffffff;
  font-weight:800;
  line-height:1.25;
}
.infotech-howto-310ux1 .howto-text{
  margin:0;
  color:rgba(225,238,255,.75);
  line-height:1.55;
  font-size:.93rem;
}
html[lang="ja"] .infotech-howto-310ux1,
html[lang="zh-CN"] .infotech-howto-310ux1,
html[lang="ko"] .infotech-howto-310ux1{
  word-break: keep-all;
  line-break: strict;
}
html[lang="ja"] .infotech-howto-310ux1 h2,
html[lang="zh-CN"] .infotech-howto-310ux1 h2,
html[lang="ko"] .infotech-howto-310ux1 h2{
  line-height:1.22;
}
@media (max-width: 860px){
  .infotech-howto-310ux1 .howto-head{display:block;}
  .infotech-howto-310ux1 .howto-note{margin-top:10px; max-width:none;}
  .infotech-howto-310ux1 .howto-grid{grid-template-columns:1fr;}
  .infotech-howto-310ux1 .howto-step{min-height:auto;}
}
@media (prefers-reduced-motion: reduce){
  .infotech-howto-310ux1{scroll-margin-top: 12px;}
}