/* 팔차 v0.2 공통 디자인 토큰과 컴포넌트를 정의하는 스타일시트임 */
:root {
  --nalsseoyo_system-colorInk: #111f39;
  --nalsseoyo_system-colorPrimary: #173f8f;
  --nalsseoyo_system-colorPrimaryStrong: #0d2d70;
  --nalsseoyo_system-colorPrimaryBright: #2a5bc2;
  --nalsseoyo_system-colorSlate: #647087;
  --nalsseoyo_system-colorMuted: #8590a4;
  --nalsseoyo_system-colorLine: #d8e0eb;
  --nalsseoyo_system-colorLineSoft: #e9eef5;
  --nalsseoyo_system-colorSurface: #ffffff;
  --nalsseoyo_system-colorSurfaceSoft: #f7f9fd;
  --nalsseoyo_system-colorBlueWash: #eef4ff;
  --nalsseoyo_system-colorDanger: #a62a2a;
  --nalsseoyo_system-shadowSoft: 0 14px 40px rgba(28, 51, 89, .07);
  --nalsseoyo_system-shadowHover: 0 18px 44px rgba(22, 54, 112, .12);
  --nalsseoyo_system-radiusS: 8px;
  --nalsseoyo_system-radiusM: 13px;
  --nalsseoyo_system-radiusL: 20px;
  --nalsseoyo_system-contentWidth: 1450px;
}

* { box-sizing: border-box; }
html { min-width: 320px; color-scheme: light; }
body {
  margin: 0;
  color: var(--nalsseoyo_system-colorInk);
  background: #fff;
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
h1,h2,h3,h4,h5,h6,strong,b {
  font-family: 'KblJump', 'Pretendard', sans-serif;
  font-weight: 700;
  font-synthesis: none;
}

/* 키보드 사용자가 현재 초점을 즉시 인식하도록 전역 포커스 표시를 유지함 */
:focus-visible { outline: 3px solid rgba(23,63,143,.28); outline-offset: 3px; }

.nalsseoyo_system-siteHeader {
  position: relative;
  z-index: 20;
  height: 88px;
  border-bottom: 1px solid var(--nalsseoyo_system-colorLineSoft);
  background: rgba(255,255,255,.97);
  backdrop-filter: blur(12px);
}
.nalsseoyo_system-siteHeaderInner {
  width: min(calc(100% - 72px), var(--nalsseoyo_system-contentWidth));
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.nalsseoyo_system-brand {
  font-family: 'KblJump','Pretendard',sans-serif;
  font-size: 37px;
  line-height: 1;
  letter-spacing: -2.4px;
  font-weight: 700;
  color: var(--nalsseoyo_system-colorPrimaryStrong);
}
.nalsseoyo_system-headerNav,.nalsseoyo_system-headerActions {
  display: flex;
  align-items: center;
  gap: 38px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -.25px;
}
.nalsseoyo_system-headerNav a,.nalsseoyo_system-headerActions a { transition: color .16s ease; }
.nalsseoyo_system-headerNav a:hover,.nalsseoyo_system-headerActions a:hover { color: var(--nalsseoyo_system-colorPrimary); }
.nalsseoyo_system-headerActions { gap: 28px; }
.nalsseoyo_system-headerDivider { width: 1px; height: 26px; background: var(--nalsseoyo_system-colorLine); }
.nalsseoyo_system-accountLink { display: inline-flex; align-items: center; gap: 8px; }
.nalsseoyo_system-accountIcon { width: 22px; height: 22px; opacity: .92; }

.nalsseoyo_system-pageBackdrop {
  position: relative;
  min-height: calc(100vh - 88px);
  overflow: hidden;
  background: linear-gradient(180deg,#fff 0%,#fff 72%,#fbfcff 100%);
}
.nalsseoyo_system-pageBackdrop::before {
  content: '';
  position: absolute;
  pointer-events: none;
  width: 810px;
  height: 810px;
  right: -118px;
  top: 128px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%,rgba(31,77,156,.018) 0 28%,rgba(31,77,156,.068) 29% 62%,rgba(31,77,156,.02) 63% 100%);
}
.nalsseoyo_system-pageBackdrop::after {
  content: '';
  position: absolute;
  pointer-events: none;
  width: 390px;
  height: 960px;
  right: 20px;
  top: -270px;
  border-radius: 48%;
  transform: rotate(28deg);
  background: linear-gradient(180deg,rgba(36,79,160,.02),rgba(36,79,160,.085),rgba(36,79,160,0));
  opacity: .55;
}
.nalsseoyo_system-pageShell {
  position: relative;
  z-index: 2;
  width: min(calc(100% - 72px), var(--nalsseoyo_system-contentWidth));
  margin: 0 auto;
}
.nalsseoyo_system-breadcrumb {
  padding-top: 28px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #708098;
  font-size: 13px;
}
.nalsseoyo_system-breadcrumbIcon { width: 17px; height: 17px; opacity: .78; }
.nalsseoyo_system-breadcrumbArrow { color: #a7b0bf; }

.nalsseoyo_system-hero { padding: 78px 26px 62px; }
.nalsseoyo_system-homeHero { padding-top: 104px; padding-bottom: 68px; }
.nalsseoyo_system-heroTitle {
  margin: 0;
  max-width: 850px;
  font-family: 'KblJump','Pretendard',sans-serif;
  font-weight: 700;
  color: var(--nalsseoyo_system-colorInk);
  font-size: clamp(48px,4.6vw,72px);
  line-height: 1.22;
  letter-spacing: -1px;
}
.nalsseoyo_system-homeHero .nalsseoyo_system-heroTitle { max-width: 980px; }
.nalsseoyo_system-categoryHeroTitle { font-size: clamp(43px,4vw,63px); line-height: 1.18; }
.nalsseoyo_system-accentText { color: var(--nalsseoyo_system-colorPrimary); }
.nalsseoyo_system-sloganBrand {
  display: inline-block;
  margin-top: .05em;
  font-size: 2.0em;
  line-height: .98;
  letter-spacing: -3.0px;
  color: var(--nalsseoyo_system-colorPrimary);
  text-shadow: 0 6px 22px rgba(23,63,143,.08);
}
.nalsseoyo_system-heroLead {
  margin: 24px 0 0;
  color: var(--nalsseoyo_system-colorSlate);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: -.2px;
}

.nalsseoyo_system-categoryGrid {
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  gap: 14px;
  padding-bottom: 70px;
}
.nalsseoyo_system-categoryCard {
  min-height: 360px;
  padding: 42px 22px 32px;
  border: 1px solid #d5dde9;
  border-radius: 15px;
  background: rgba(255,255,255,.9);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  box-shadow: 0 2px 0 rgba(26,50,90,.015);
  transition: transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.nalsseoyo_system-categoryCard:hover {
  transform: translateY(-3px);
  border-color: #b9c9df;
  background: #fff;
  box-shadow: var(--nalsseoyo_system-shadowHover);
}
.nalsseoyo_system-categoryIconWrap {
  width: 118px;
  height: 118px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.nalsseoyo_system-categoryIcon { width: 104px; height: 104px; object-fit: contain; }
.nalsseoyo_system-categoryDash { width: 24px; height: 3px; border-radius: 3px; background: var(--nalsseoyo_system-colorPrimary); margin-top: 11px; }
.nalsseoyo_system-categoryName {
  margin: 22px 0 0;
  font-family: 'KblJump','Pretendard',sans-serif;
  color: #17233a;
  font-size: 25px;
  font-weight: 700;
  letter-spacing: -1.2px;
}
.nalsseoyo_system-categoryDescription {
  margin: 15px 0 0;
  color: #768196;
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: -.2px;
}

.nalsseoyo_system-filterPanel {
  margin: 0 0 60px;
  padding: 24px;
  border: 1px solid var(--nalsseoyo_system-colorLine);
  border-radius: 15px;
  background: rgba(255,255,255,.96);
  box-shadow: var(--nalsseoyo_system-shadowSoft);
}
.nalsseoyo_system-filterForm {
  display: grid;
  grid-template-columns: repeat(var(--nalsseoyo_system-filterColumns,4),minmax(0,1fr)) auto;
  align-items: end;
  gap: 12px;
}
.nalsseoyo_system-fieldGroup { min-width: 0; }
.nalsseoyo_system-fieldGroup + .nalsseoyo_system-fieldGroup { margin-top: 0; }
.nalsseoyo_system-fieldLabel { display:block; margin:0 0 8px; color:#5e6a7f; font-size:12px; font-weight:600; }
.nalsseoyo_system-fieldControl {
  width:100%; height:48px; padding:0 13px; border:1px solid #d5ddea; border-radius:9px; background:#fff; color:#24324b; outline:0;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.nalsseoyo_system-fieldControl:focus { border-color:#9ab1d6; box-shadow:0 0 0 3px rgba(23,63,143,.08); }
.nalsseoyo_system-searchButton,.nalsseoyo_system-primaryButton,.nalsseoyo_system-secondaryButton {
  min-height:48px; border-radius:9px; border:1px solid transparent; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 20px;
  font-family:'KblJump','Pretendard',sans-serif; font-weight:700; letter-spacing:-.35px;
}
.nalsseoyo_system-searchButton,.nalsseoyo_system-primaryButton { color:#fff; background:var(--nalsseoyo_system-colorPrimary); border-color:var(--nalsseoyo_system-colorPrimary); }
.nalsseoyo_system-searchButton:hover,.nalsseoyo_system-primaryButton:hover { background:var(--nalsseoyo_system-colorPrimaryStrong); }
.nalsseoyo_system-secondaryButton { color:var(--nalsseoyo_system-colorPrimary); background:#fff; border-color:#bdcbe0; }
.nalsseoyo_system-secondaryButton:hover { background:#f7f9fd; border-color:#9fb4d3; }
.nalsseoyo_system-buttonIcon { width:18px; height:18px; filter:brightness(0) invert(1); }

.nalsseoyo_system-sectionHeader { display:flex; align-items:end; justify-content:space-between; gap:24px; margin:0 0 18px; }
.nalsseoyo_system-sectionTitle { margin:0; font-family:'KblJump','Pretendard',sans-serif; font-size:22px; font-weight:700; letter-spacing:-.8px; }
.nalsseoyo_system-sectionHint { color:var(--nalsseoyo_system-colorMuted); font-size:12px; }
.nalsseoyo_system-typeGrid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:13px; margin-bottom:60px; }
.nalsseoyo_system-typeCard {
  min-height:226px; padding:22px 18px 16px; border:1px solid var(--nalsseoyo_system-colorLine); border-radius:13px; background:#fff; transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease;
}
.nalsseoyo_system-typeCard:hover { border-color:#b3c4dc; transform:translateY(-2px); box-shadow:var(--nalsseoyo_system-shadowSoft); }
.nalsseoyo_system-typeCardIcon { height:130px; display:flex; align-items:center; justify-content:center; }
.nalsseoyo_system-typeCardIcon img { width:112px; height:112px; object-fit:contain; }
.nalsseoyo_system-typeCardDash { width:22px; height:2px; background:var(--nalsseoyo_system-colorPrimary); border-radius:2px; margin:0 auto 13px; }
.nalsseoyo_system-typeCardFooter { display:flex; align-items:center; justify-content:space-between; gap:10px; font-family:'KblJump','Pretendard',sans-serif; font-size:16px; font-weight:700; }
.nalsseoyo_system-typeCardArrow { color:var(--nalsseoyo_system-colorPrimary); font-size:22px; line-height:1; }

.nalsseoyo_system-trustStrip {
  display:grid; grid-template-columns:repeat(3,1fr); margin:0 0 76px; border:1px solid var(--nalsseoyo_system-colorLine); border-radius:14px; background:rgba(255,255,255,.92); overflow:hidden;
}
.nalsseoyo_system-trustItem { min-height:112px; padding:24px 28px; display:flex; align-items:center; gap:17px; }
.nalsseoyo_system-trustItem + .nalsseoyo_system-trustItem { border-left:1px solid var(--nalsseoyo_system-colorLine); }
.nalsseoyo_system-trustIcon { width:30px; height:30px; opacity:.88; }
.nalsseoyo_system-trustTitle { font-family:'KblJump','Pretendard',sans-serif; font-size:15px; font-weight:700; }
.nalsseoyo_system-trustText { margin-top:5px; color:var(--nalsseoyo_system-colorMuted); font-size:12px; line-height:1.55; }

.nalsseoyo_system-resultsLayout { display:grid; grid-template-columns:250px minmax(0,1fr); gap:26px; padding-bottom:68px; }
.nalsseoyo_system-resultsFilter { padding:22px; border:1px solid var(--nalsseoyo_system-colorLine); border-radius:13px; background:#fff; align-self:start; }
.nalsseoyo_system-resultsFilter .nalsseoyo_system-fieldGroup + .nalsseoyo_system-fieldGroup { margin-top:17px; }
.nalsseoyo_system-resultsHeader { min-height:54px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--nalsseoyo_system-colorLineSoft); margin-bottom:14px; }
.nalsseoyo_system-resultList { display:grid; gap:12px; }
.nalsseoyo_system-resultCard {
  display:grid; grid-template-columns:150px minmax(0,1fr) auto; gap:22px; align-items:center; padding:18px; border:1px solid var(--nalsseoyo_system-colorLine); border-radius:13px; background:#fff; transition:border-color .15s ease,box-shadow .15s ease;
}
.nalsseoyo_system-resultCard:hover { border-color:#b8c7dc; box-shadow:var(--nalsseoyo_system-shadowSoft); }
.nalsseoyo_system-demoImage { width:150px; height:112px; border-radius:11px; overflow:hidden; background:var(--nalsseoyo_system-colorSurfaceSoft); border:1px solid #e5ebf4; display:flex; align-items:center; justify-content:center; }
.nalsseoyo_system-demoImage img { width:104px; height:104px; object-fit:contain; }
.nalsseoyo_system-resultTitle { margin:0; font-family:'KblJump','Pretendard',sans-serif; font-size:18px; font-weight:700; letter-spacing:-.55px; }
.nalsseoyo_system-resultMeta { margin-top:7px; color:#748096; font-size:13px; line-height:1.55; }
.nalsseoyo_system-tagRow { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.nalsseoyo_system-tag { padding:5px 8px; border-radius:999px; background:#f0f4fa; color:#5a6c89; font-size:11px; }
.nalsseoyo_system-resultPrice { color:var(--nalsseoyo_system-colorPrimary); font-family:'KblJump','Pretendard',sans-serif; font-size:21px; font-weight:700; text-align:right; white-space:nowrap; }
.nalsseoyo_system-resultAction { margin-top:12px; text-align:right; }

.nalsseoyo_system-detailLayout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(320px,.65fr); gap:30px; padding:45px 0 76px; }
.nalsseoyo_system-detailMainVisual { min-height:440px; border:1px solid var(--nalsseoyo_system-colorLine); border-radius:18px; background:linear-gradient(145deg,#fbfcff,#f2f6fc); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.nalsseoyo_system-detailMainVisual img { width:min(440px,76%); max-height:360px; object-fit:contain; }
.nalsseoyo_system-detailPanel { padding:27px; border:1px solid var(--nalsseoyo_system-colorLine); border-radius:15px; background:#fff; align-self:start; }
.nalsseoyo_system-detailPrice { margin-top:22px; color:var(--nalsseoyo_system-colorPrimary); font-family:'KblJump','Pretendard',sans-serif; font-size:31px; font-weight:700; }
.nalsseoyo_system-detailFacts { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:18px; }
.nalsseoyo_system-detailFact { padding:16px; border:1px solid var(--nalsseoyo_system-colorLine); border-radius:10px; background:#fff; }
.nalsseoyo_system-detailFact dt { color:var(--nalsseoyo_system-colorMuted); font-size:12px; }
.nalsseoyo_system-detailFact dd { margin:6px 0 0; font-family:'KblJump','Pretendard',sans-serif; font-size:14px; font-weight:700; }
.nalsseoyo_system-backendNotice { display:none; }

.nalsseoyo_system-siteFooter { padding:34px 0 46px; color:var(--nalsseoyo_system-colorMuted); font-size:12px; background:#fff; }
.nalsseoyo_system-siteFooterInner { display:flex; justify-content:space-between; gap:24px; padding-top:20px; border-top:1px solid var(--nalsseoyo_system-colorLineSoft); }
.nalsseoyo_system-footerLinks { display:flex; gap:18px; flex-wrap:wrap; }

/* 백엔드 연결 전 동작은 사용자에게 개발 명세를 노출하지 않고 비활성 상태만 유지함 */
.nalsseoyo_system-pendingAction[aria-disabled='true'] { cursor:default; }

@media (max-width:1120px) {
  .nalsseoyo_system-headerNav { display:none; }
  .nalsseoyo_system-categoryGrid,.nalsseoyo_system-typeGrid { grid-template-columns:repeat(3,1fr); }
  .nalsseoyo_system-filterForm { grid-template-columns:repeat(2,1fr); }
  .nalsseoyo_system-searchButton { grid-column:span 2; }
  .nalsseoyo_system-resultsLayout,.nalsseoyo_system-detailLayout { grid-template-columns:1fr; }
  .nalsseoyo_system-resultsFilter { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
  .nalsseoyo_system-resultsFilter .nalsseoyo_system-fieldGroup + .nalsseoyo_system-fieldGroup { margin-top:0; }
}
@media (max-width:720px) {
  .nalsseoyo_system-siteHeader { height:72px; }
  .nalsseoyo_system-siteHeaderInner,.nalsseoyo_system-pageShell { width:min(calc(100% - 32px),var(--nalsseoyo_system-contentWidth)); }
  .nalsseoyo_system-headerActions > a:not(.nalsseoyo_system-accountLink),.nalsseoyo_system-headerDivider { display:none; }
  .nalsseoyo_system-brand { font-size:31px; }
  .nalsseoyo_system-hero,.nalsseoyo_system-homeHero { padding:58px 2px 46px; }
  .nalsseoyo_system-heroTitle { font-size:43px; letter-spacing:-1.75px; }
  .nalsseoyo_system-sloganBrand { letter-spacing:-2.8px; }
  .nalsseoyo_system-categoryGrid,.nalsseoyo_system-typeGrid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .nalsseoyo_system-categoryCard { min-height:270px; padding:28px 14px 23px; }
  .nalsseoyo_system-categoryIconWrap { width:92px; height:92px; }
  .nalsseoyo_system-categoryIcon { width:84px; height:84px; }
  .nalsseoyo_system-categoryName { font-size:20px; }
  .nalsseoyo_system-categoryDescription { font-size:12px; margin-top:12px; }
  .nalsseoyo_system-filterPanel { padding:20px; }
  .nalsseoyo_system-filterForm { grid-template-columns:1fr; gap:14px; }
  .nalsseoyo_system-searchButton { grid-column:auto; }
  .nalsseoyo_system-trustStrip { grid-template-columns:1fr; }
  .nalsseoyo_system-trustItem + .nalsseoyo_system-trustItem { border-left:0; border-top:1px solid var(--nalsseoyo_system-colorLine); }
  .nalsseoyo_system-resultCard { grid-template-columns:105px minmax(0,1fr); gap:14px; }
  .nalsseoyo_system-demoImage { width:105px; height:92px; }
  .nalsseoyo_system-demoImage img { width:84px; height:84px; }
  .nalsseoyo_system-resultCard > :last-child { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; }
  .nalsseoyo_system-resultsFilter { grid-template-columns:1fr; }
  .nalsseoyo_system-detailFacts { grid-template-columns:repeat(2,1fr); }
  .nalsseoyo_system-detailMainVisual { min-height:300px; }
  .nalsseoyo_system-siteFooterInner { flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.001ms!important; animation-duration:.001ms!important; animation-iteration-count:1!important; }
}

/* 짧은 내비게이션·브랜드 텍스트가 좁은 flex 계산에서 임의 줄바꿈되지 않게 고정함 */
.nalsseoyo_system-brand,
.nalsseoyo_system-headerNav a,
.nalsseoyo_system-headerActions a,
.nalsseoyo_system-categoryName,
.nalsseoyo_system-typeCardFooter { white-space: nowrap; }
