/* ── USID 시스템 구성도 섹션 (세로 나열) ───────────────────
   usid- 접두사로 네임스페이스 처리했으므로 기존 홈페이지 CSS와 충돌하지 않습니다. */
.usid-cases{
  --usid-bg:#0A1024; --usid-bg2:#070B18;
  --usid-line:rgba(255,255,255,.12);
  --usid-ink:#F4F7FD; --usid-ink2:#93A6C4; --usid-ink3:#6F83A3;
  --usid-accent:#5CC8FF; --usid-accent2:#F2B65A;
  background:linear-gradient(180deg,var(--usid-bg) 0%,var(--usid-bg2) 100%);
  color:var(--usid-ink);
  font-family:'Pretendard','Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  padding:72px 24px 80px;
  box-sizing:border-box;
}
.usid-cases *,.usid-cases *::before,.usid-cases *::after{box-sizing:inherit;}
.usid-inner{max-width:1200px;margin:0 auto;}

.usid-eyebrow{
  display:inline-block;margin:0 0 14px;padding:6px 14px;border-radius:999px;
  font-size:12.5px;font-weight:700;letter-spacing:.04em;
  color:var(--usid-accent2);background:rgba(242,182,90,.12);
  border:1px solid rgba(242,182,90,.45);
}
.usid-h2{margin:0 0 12px;font-size:clamp(24px,3.4vw,34px);font-weight:700;line-height:1.3;}
.usid-lead{margin:0 0 34px;font-size:15px;line-height:1.75;color:var(--usid-ink2);max-width:60ch;}

/* 사례 카드 (세로 나열) */
.usid-case{margin:0 0 56px;}
.usid-case:last-of-type{margin-bottom:0;}

/* 제목·설명은 구성도 이미지 안에 이미 그려져 있으므로 화면에서는 숨기고,
   검색엔진·스크린리더용 텍스트로만 남깁니다.
   (이미지 위에 제목을 노출하고 싶다면 아래 블록을 통째로 삭제하세요) */
.usid-case__head{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}
.usid-case__title{margin:0;}
.usid-case__desc{margin:0;}

.usid-figure{
  margin:0;border-radius:18px;overflow:hidden;
  border:1px solid var(--usid-line);
  box-shadow:0 24px 60px rgba(0,0,0,.45);
  background:#0A1024;
  line-height:0;
}
.usid-figure .diagram{display:block;width:100%;height:auto;}

.usid-note{
  margin:22px 0 0;font-size:12.5px;line-height:1.7;color:var(--usid-ink3);
  padding-top:18px;border-top:1px solid var(--usid-line);
}

@media (max-width:640px){
  .usid-cases{padding:48px 16px 56px;}
  .usid-case{margin-bottom:36px;}
  .usid-figure{border-radius:12px;}
}
@media (prefers-reduced-motion:reduce){
  .usid-cases animate,.usid-cases animateMotion{display:none;}
}
.usid-reveal{opacity:1;transform:none;transition:opacity .55s ease,transform .55s ease;}
@media (prefers-reduced-motion:no-preference){.usid-reveal[data-usid-hidden="true"]{opacity:0;transform:translateY(20px);}}
.usid-top{position:fixed;right:22px;bottom:22px;z-index:9999;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid rgba(92,200,255,.5);border-radius:50%;background:#0A1024;color:#F4F7FD;font:700 11px/1 Arial,sans-serif;cursor:pointer;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease,transform .2s ease;}
.usid-top.is-visible{opacity:1;visibility:visible;}.usid-top:hover{transform:translateY(-3px);}
@media(max-width:640px){.usid-top{right:14px;bottom:14px;width:38px;height:38px;}}

