/* ===========================================================================
   NEXORA24 넥소라24 — 무인매장 솔루션·창업 플랫폼
   원자료: NEXORA24-unmanned-store-platform-AI-build-pack
   · 색·타이포·간격·라운드는 05-data/design-tokens.json 이 정본,
     실제 톤은 01-reference-pages/hq 실측으로 보정했다(주석에 근거 병기).
   · 시안을 배경으로 깔지 않는다. 사진은 02-assets/images/webp 실물만.
   ========================================================================= */

:root{
  /* 토큰 정본 — design-tokens.json */
  --night:#0D1718;
  --paper:#F3F6F3;
  --mint:#7CF2C4;
  --cobalt:#4C6FFF;
  --orange:#FF704D;
  --graphite:#232B2B;
  --muted:#728080;
  --white:#FFFFFF;

  /* 시안 실측 보정 — 헤더·히어로는 토큰보다 더 깊게 깔린다(#041318 실측) */
  --night-deep:#061418;
  --night-2:#0A1C22;      /* 다크 절 바탕 */
  --night-card:#102730;   /* 다크 위 카드 */
  --night-line:rgba(124,242,196,.16);
  --paper-2:#EAEFEC;      /* 밝은 절의 교대 톤 */
  --line:#DCE3DF;
  --line-soft:#E8EDEA;

  /* 대비 보정 — muted(#728080)는 paper 위에서 3.9:1 이라 본문 4.5:1 을 못 넘긴다.
     색상은 유지하고 명도만 낮춘 값(4.6:1). 큰 글자에는 원 토큰을 그대로 쓴다. */
  --muted-ink:#5C6A6A;
  --mint-ink:#0B6B48;     /* 밝은 바탕 위 민트 글자 — 민트 원색은 1.4:1 */
  --orange-ink:#BE3E24;   /* 밝은 바탕 위 주황 글자 */
  --cobalt-ink:#3355E0;

  --max:1280px;
  --gutter:24px;
  --sec:120px;
  --sec-m:72px;

  --r-sm:8px;
  --r-md:16px;
  --r-lg:28px;
  --r-pill:999px;

  --f-sans:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,system-ui,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  --f-lat:'Jost','Pretendard Variable',sans-serif;

  --t-fast:150ms;
  --t-panel:240ms;
  --t-reveal:480ms;
}

*,*::before,*::after{box-sizing:border-box}
/* overflow-x:clip — 화면 밖에 대기시킨 서랍(.drawer)이 가로 스크롤을 만들지 않게 한다.
   hidden 과 달리 스크롤 컨테이너를 만들지 않아 position:sticky 가 그대로 산다. */
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip}
body{
  margin:0;background:var(--paper);color:var(--graphite);
  font-family:var(--f-sans);font-size:16px;line-height:1.7;font-weight:400;
  letter-spacing:-.01em;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,h5,p,figure,dl,dd,blockquote{margin:0}
table{border-collapse:collapse;width:100%}
hr{border:0;border-top:1px solid var(--line);margin:0}
svg{display:block}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--cobalt);outline-offset:2px}
.on-night :focus-visible,.site-header :focus-visible{outline-color:var(--mint)}

.skip-link{position:absolute;left:-9999px;top:0;z-index:300;background:var(--mint);color:var(--night);padding:14px 22px;font-weight:700;border-radius:0 0 var(--r-sm) 0}
.skip-link:focus{left:0}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ------------------------------------------------------------- 타이포 */
.display{font-size:64px;line-height:1.125;font-weight:800;letter-spacing:-.04em}
h1,.h1{font-size:52px;line-height:1.155;font-weight:800;letter-spacing:-.038em}
h2,.h2{font-size:40px;line-height:1.2;font-weight:700;letter-spacing:-.032em}
h3,.h3{font-size:26px;line-height:1.31;font-weight:700;letter-spacing:-.025em}
.h4{font-size:20px;line-height:1.4;font-weight:700;letter-spacing:-.02em}
.small{font-size:14px;line-height:1.57}
.tiny{font-size:12.5px;line-height:1.5}
.muted{color:var(--muted-ink)}
.num{font-variant-numeric:tabular-nums}
.lat{font-family:var(--f-lat);letter-spacing:.02em}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-ink)}
.mint{color:var(--mint-ink)}
.on-night .mint,.night .mint{color:var(--mint)}

/* ------------------------------------------------------------- 레이아웃 */
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.section{padding:var(--sec) 0}
.section-sm{padding:72px 0}
.section-xs{padding:48px 0}
.night{background:var(--night);color:#E7EFEC}
.night-deep{background:var(--night-deep);color:#E7EFEC}
.paper-2{background:var(--paper-2)}
.white{background:var(--white)}
.grid{display:grid;gap:24px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.g6{grid-template-columns:repeat(6,minmax(0,1fr))}
.g7{grid-template-columns:repeat(7,minmax(0,1fr))}
.between{display:flex;align-items:center;justify-content:space-between;gap:20px}
.between > *{min-width:0}
.row{display:flex;align-items:center;gap:12px}
.grid > *{min-width:0}

.sec-head{margin-bottom:32px}
.sec-head h2{margin-bottom:10px}
.sec-head p{color:var(--muted-ink);font-size:15px}
.sec-head.row-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.night .sec-head p,.night-deep .sec-head p{color:rgba(231,239,236,.66)}

.more{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--mint-ink)}
.night .more,.night-deep .more{color:var(--mint)}
.more::after{content:"→";transition:transform var(--t-fast)}
.more:hover::after{transform:translateX(4px)}

/* ------------------------------------------------------------- 헤더 */
.site-header{background:var(--night-deep);color:#E7EFEC;position:relative;z-index:80}
.header-in{max-width:var(--max);margin:0 auto;padding:18px var(--gutter);display:flex;align-items:center;gap:34px}
.brand{display:inline-flex;align-items:baseline;gap:9px;flex:none}
.brand .mark{font-family:var(--f-lat);font-size:25px;font-weight:300;letter-spacing:.06em;color:#fff}
.brand .mark b{font-weight:500;color:var(--mint);letter-spacing:.01em}
.brand .ko{font-size:12px;color:rgba(231,239,236,.62)}
.gnb{display:flex;align-items:center;gap:30px;margin-left:14px}
.gnb a{font-size:15px;font-weight:600;color:rgba(231,239,236,.86);white-space:nowrap;padding:8px 0;position:relative}
.gnb a:hover{color:#fff}
.gnb a[aria-current="page"]{color:var(--mint)}
.gnb a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--mint)}
.header-cta{margin-left:auto;display:flex;align-items:center;gap:10px;flex:none}
.menu-btn{display:none;width:44px;height:44px;place-items:center;color:#E7EFEC}
.menu-btn span,.menu-btn span::before,.menu-btn span::after{content:"";display:block;width:20px;height:2px;background:currentColor;position:relative}
.menu-btn span::before{position:absolute;top:-6px}
.menu-btn span::after{position:absolute;top:6px}

.scrim{position:fixed;inset:0;background:rgba(6,20,24,.6);opacity:0;visibility:hidden;transition:opacity var(--t-panel);z-index:110}
.scrim.on{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(88vw,340px);background:var(--night-deep);color:#E7EFEC;
  transform:translateX(100%);transition:transform var(--t-panel);z-index:120;display:flex;flex-direction:column;overflow-y:auto}
.drawer.on{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid rgba(231,239,236,.14)}
.drawer nav a{display:block;padding:15px 20px;font-size:16px;font-weight:600;border-bottom:1px solid rgba(231,239,236,.08)}
.drawer-foot{padding:20px;display:grid;gap:10px}

/* ------------------------------------------------------------- 단추 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 24px;
  border-radius:var(--r-sm);font-size:15px;font-weight:700;letter-spacing:-.02em;border:1px solid transparent;
  transition:background var(--t-fast),color var(--t-fast),border-color var(--t-fast)}
.btn-mint{background:var(--mint);color:#06231A}
.btn-mint:hover{background:#63E5B3}
.btn-night{background:var(--night);color:var(--mint)}
.btn-night:hover{background:#16292C}
.btn-ghost{border-color:rgba(231,239,236,.36);color:#E7EFEC;background:transparent}
.btn-ghost:hover{border-color:var(--mint);color:var(--mint)}
.btn-line{border-color:var(--line);background:var(--white);color:var(--graphite)}
.btn-line:hover{border-color:var(--graphite)}
.btn-green{background:#12805A;color:#fff}
.btn-green:hover{background:#0E6A4A}
.btn-cobalt{background:var(--cobalt);color:#fff}
.btn-orange{background:#E85A38;color:#fff}
.btn-sm{min-height:40px;padding:0 16px;font-size:13.5px}
.btn-lg{min-height:56px;padding:0 30px;font-size:16px}
.btn-block{width:100%}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.45;pointer-events:none}
.btn-w220{min-width:220px}

.chip{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 15px;border-radius:var(--r-pill);
  border:1px solid var(--line);background:var(--white);font-size:13.5px;font-weight:600;color:var(--graphite)}
.chip[aria-pressed="true"],.chip.on{background:rgba(124,242,196,.18);border-color:#37B98A;color:#0B5C40}
.night .chip,.night-deep .chip{background:rgba(231,239,236,.06);border-color:rgba(231,239,236,.2);color:#E7EFEC}
.night .chip[aria-pressed="true"],.night-deep .chip[aria-pressed="true"]{background:rgba(124,242,196,.16);border-color:var(--mint);color:var(--mint)}

.tag{display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:0 9px;border-radius:var(--r-sm);
  font-size:12px;font-weight:700;letter-spacing:-.01em}
.tag-mint{background:rgba(124,242,196,.2);color:#0B5C40}
.tag-cobalt{background:rgba(76,111,255,.14);color:var(--cobalt-ink)}
.tag-orange{background:rgba(255,112,77,.16);color:var(--orange-ink)}
.tag-grey{background:rgba(114,128,128,.16);color:var(--muted-ink)}
.tag-sample{background:rgba(124,242,196,.16);color:#0B5C40;border:1px solid rgba(11,92,64,.22)}
.night .tag-sample,.night-deep .tag-sample{background:rgba(124,242,196,.14);color:var(--mint);border-color:var(--night-line)}

/* ------------------------------------------------------------- 카드·판 */
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md)}
.card-pad{padding:28px}
.card-dark{background:var(--night-card);border:1px solid var(--night-line);border-radius:var(--r-md)}
.plain{background:var(--paper-2);border-radius:var(--r-md)}

.metric-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid var(--night-line);
  border-radius:var(--r-md);background:rgba(231,239,236,.04);overflow:hidden}
.metric-strip li{display:flex;align-items:center;gap:14px;padding:22px 26px;border-left:1px solid var(--night-line)}
.metric-strip li:first-child{border-left:0}
.metric-strip .mi{width:34px;height:34px;flex:none;color:var(--mint)}
.metric-strip .mv{font-size:20px;font-weight:700;color:var(--mint);letter-spacing:-.02em}
.metric-strip .ml{font-size:13px;color:rgba(231,239,236,.68);margin-top:3px}

.kpi{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.kpi .k{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px 22px}
.kpi .kl{font-size:13.5px;color:var(--muted-ink)}
.kpi .kv{font-size:26px;font-weight:800;letter-spacing:-.035em;margin-top:8px}
.kpi .kd{font-size:12.5px;margin-top:7px;color:var(--muted-ink)}
.up{color:#0B7A52;font-weight:700}
.down{color:var(--orange-ink);font-weight:700}

.feat{display:grid;gap:14px}
.feat li{display:flex;gap:11px;font-size:14.5px;line-height:1.65}
.feat li::before{content:"✓";color:#0B7A52;font-weight:800;flex:none}
.night .feat li::before,.night-deep .feat li::before{color:var(--mint)}
.dot-list li{display:flex;gap:10px;font-size:14px;line-height:1.7;color:var(--muted-ink)}
.dot-list li::before{content:"•";color:var(--mint-ink);flex:none}
.night .dot-list li,.night-deep .dot-list li{color:rgba(231,239,236,.72)}
.night .dot-list li::before,.night-deep .dot-list li::before{color:var(--mint)}

/* 사진 상자 — 상자가 비율을 정하고 사진이 채운다 */
.ib{display:block;overflow:hidden;background:var(--paper-2);border-radius:var(--r-md)}
.ib > img{width:100%;height:100%;object-fit:cover}
.ib-1{aspect-ratio:1}
.ib-43{aspect-ratio:4/3}
.ib-32{aspect-ratio:3/2}
.ib-169{aspect-ratio:16/9}
.ib-219{aspect-ratio:21/9}
.ib-sq{border-radius:var(--r-sm)}
.night .ib,.night-deep .ib{background:var(--night-card)}

/* ------------------------------------------------------------- 히어로 */
.hero{position:relative;background:var(--night-deep);color:#fff;overflow:hidden}
.hero-media{position:absolute;inset:0 0 0 38%}
.hero-media img{width:100%;height:100%;object-fit:cover}
.hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--night-deep) 4%,rgba(6,20,24,.86) 26%,rgba(6,20,24,.24) 66%,rgba(6,20,24,.5) 100%)}
.hero-in{position:relative;z-index:2;max-width:var(--max);margin:0 auto;padding:96px var(--gutter) 84px}
.hero h1 .mint{color:var(--mint)}
.hero .lede{margin-top:24px;font-size:17px;line-height:1.8;color:rgba(231,239,236,.8);max-width:34ch}
.hero .cta-row{display:flex;gap:12px;margin-top:38px;flex-wrap:wrap}
.hero .crumb{margin-bottom:26px}
.hero-pills{display:flex;gap:0;margin-top:34px;flex-wrap:wrap;border:1px solid var(--night-line);border-radius:var(--r-pill);padding:6px 4px;width:max-content;max-width:100%}
.hero-pills li{display:flex;align-items:center;gap:8px;padding:6px 16px;font-size:13.5px;color:rgba(231,239,236,.84);border-left:1px solid var(--night-line)}
.hero-pills li:first-child{border-left:0}
.hero-pills .pi{width:18px;height:18px;color:var(--mint);flex:none}

/* 히어로 안의 라이브 패널 */
.live-panel{background:rgba(10,28,34,.92);border:1px solid var(--night-line);border-radius:var(--r-md);padding:20px 22px;backdrop-filter:blur(4px)}
.live-panel .lp-head{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;color:rgba(231,239,236,.7);margin-bottom:16px}
.live-panel .lp-head .lat{font-size:14px;color:#fff}
.live-dot{display:inline-flex;align-items:center;gap:6px;color:var(--mint);font-weight:600}
.live-dot::before{content:"";width:7px;height:7px;border-radius:999px;background:var(--mint)}
.live-panel .lv{font-size:30px;font-weight:800;letter-spacing:-.035em;color:#fff}
.live-panel .ll{font-size:12.5px;color:rgba(231,239,236,.62)}
.live-panel .lrow{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.live-panel .lrow .lv{font-size:21px}

/* 히어로 우측 핫스팟 목록 */
.hotspots{display:grid;gap:12px}
.hotspots li{display:flex;gap:12px;align-items:flex-start;background:rgba(10,28,34,.8);border:1px solid var(--night-line);
  border-radius:var(--r-sm);padding:11px 14px}
.hotspots .hi{width:22px;height:22px;flex:none;color:var(--mint);margin-top:2px}
.hotspots b{display:block;font-size:14px;color:#fff}
.hotspots span{font-size:12.5px;color:rgba(231,239,236,.64)}

/* ------------------------------------------------------------- 빵부스러기 */
.crumb{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(231,239,236,.62);flex-wrap:wrap}
.crumb.on-paper{color:var(--muted-ink)}
.crumb .sepc{width:0;overflow:hidden;display:inline-block}
.crumb .sepc::before{content:"›";display:inline-block;width:9px;text-align:center;opacity:.7}
.crumb a:hover{color:var(--mint)}
.crumb.on-paper a:hover{color:var(--graphite)}

/* ------------------------------------------------------------- 탭·레일 */
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tabs button,.tabs a{display:inline-flex;align-items:center;gap:9px;min-height:48px;padding:0 20px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:var(--white);font-size:14.5px;font-weight:600;color:var(--graphite)}
.tabs [aria-selected="true"],.tabs [aria-pressed="true"],.tabs .on{background:rgba(124,242,196,.2);border-color:#37B98A;color:#0B5C40}
.tabs .ti{width:20px;height:20px;flex:none}
.night .tabs button,.night-deep .tabs button{background:rgba(231,239,236,.05);border-color:rgba(231,239,236,.16);color:#E7EFEC}
.night .tabs [aria-pressed="true"],.night-deep .tabs [aria-pressed="true"]{background:var(--mint);border-color:var(--mint);color:#06231A}

.underline-tabs{display:flex;gap:30px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.underline-tabs button{padding:14px 0;font-size:15px;font-weight:600;color:var(--muted-ink);border-bottom:2px solid transparent;margin-bottom:-1px}
.underline-tabs [aria-selected="true"],.underline-tabs [aria-pressed="true"]{color:var(--graphite);border-bottom-color:#12805A}

/* 흐름 레일 */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0}
/* 제목이 두 줄인 칸이 있어도 꼬리 숫자(D-14 등)는 전 칸 같은 바닥선에 */
.rail li{position:relative;text-align:center;padding:0 14px;display:flex;flex-direction:column}
.rail li .num{margin-top:auto}
.rail li + li::before{content:"→";position:absolute;left:-10px;top:26px;color:var(--muted-ink);font-size:16px}
.night .rail li + li::before,.night-deep .rail li + li::before{color:var(--mint)}
.rail .ri{width:56px;height:56px;border-radius:var(--r-pill);display:grid;place-items:center;margin:0 auto 14px;
  background:var(--white);border:1px solid var(--line);color:var(--graphite)}
.night .rail .ri,.night-deep .rail .ri{background:rgba(231,239,236,.06);border-color:var(--night-line);color:var(--mint)}
.rail b{display:block;font-size:15px;font-weight:700}
.rail p{font-size:12.5px;color:var(--muted-ink);margin-top:6px;line-height:1.55}
.night .rail p,.night-deep .rail p{color:rgba(231,239,236,.62)}

/* 번호 단계 타임라인 */
.steps-line{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;padding-top:8px}
.steps-line::before{content:"";position:absolute;left:7%;right:7%;top:22px;height:2px;background:var(--line)}
.night .steps-line::before,.night-deep .steps-line::before{background:var(--night-line)}
.steps-line li{position:relative;text-align:center;padding:0 8px}
.steps-line .sn{width:44px;height:44px;border-radius:var(--r-pill);display:grid;place-items:center;margin:0 auto 16px;
  background:#12805A;color:#fff;font-size:14px;font-weight:700;position:relative;z-index:1}
.steps-line li:not(.done) .sn{background:var(--white);border:2px solid var(--line);color:var(--muted-ink)}
.steps-line b{display:block;font-size:15px;font-weight:700}
.steps-line p{font-size:12.5px;color:var(--muted-ink);margin-top:6px;line-height:1.5}

/* ------------------------------------------------------------- 표 */
.tbl{font-size:14px}
.tbl th,.tbl td{padding:13px 14px;text-align:left;border-bottom:1px solid var(--line-soft);vertical-align:middle}
.tbl thead th{background:var(--paper-2);font-weight:700;font-size:13px;color:var(--graphite);border-bottom:1px solid var(--line)}
.tbl tbody th{font-weight:600}
.tbl-box{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.tbl-center td,.tbl-center th{text-align:center}
.tbl-center tbody th{text-align:left}
.tbl-dark th,.tbl-dark td{border-bottom-color:var(--night-line)}
.tbl-dark thead th{background:rgba(231,239,236,.06);color:#E7EFEC;border-bottom-color:var(--night-line)}
.tbl-scroll{overflow-x:auto;min-width:0;max-width:100%}

/* 격자·가로배치 칸은 min-width:auto 때문에 내용 최소폭만큼 부풀어 지면을 밀어낸다.
   좁은 폭 넘침의 대부분이 여기서 나온다 — 칸이 줄어들 수 있게 풀어 준다. */
.dash-preview > *, .dash-shell > *, .pol-layout > *, .guide-layout > *,
.consult-layout > *, .calc-layout > *, .case-detail > *, .mission > *,
.a11y-grid > *, .arch-band > *, .privacy-2 > *, .layout-pick > *,
.quote-calc > *, .tco-row > *, .map-band > *, .console-shell > *,
.pricing-grid > *, .cs-2 > *, .sev-row > *{min-width:0}
.dash-side{min-width:0}
.dot-y{width:9px;height:9px;border-radius:999px;display:inline-block;background:#12805A}
.dot-y.opt{background:#E0A63C}
.dot-y.no{background:#C3CBC7}

/* 정의 목록 */
.dl{display:grid;grid-template-columns:120px 1fr;gap:12px 18px;font-size:14.5px}
.dl dt{color:var(--muted-ink)}
.night .dl dt,.night-deep .dl dt{color:rgba(231,239,236,.6)}

/* ------------------------------------------------------------- 폼 */
.field{display:grid;gap:8px}
.label{font-size:14px;font-weight:600}
.req{color:var(--orange-ink);margin-left:3px}
.input,input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input[type=date],input[type=search],select,textarea{
  width:100%;min-height:48px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--white);
  padding:12px 14px;font-size:15px}
textarea{min-height:120px;resize:vertical;line-height:1.65}
input[type=file]{width:100%;max-width:100%;min-width:0}
select{appearance:none;padding-right:38px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23232B2B' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
::placeholder{color:#98A5A2}
.hint{font-size:13px;color:var(--muted-ink)}
.err{font-size:13px;color:var(--orange-ink);display:flex;align-items:center;gap:6px;font-weight:600}
.err::before{content:"!";width:16px;height:16px;border-radius:999px;border:1.5px solid currentColor;display:grid;place-items:center;font-size:10px;flex:none}
.input-err{border-color:var(--orange-ink)}
.unit-row{display:flex;gap:8px;align-items:center}
.unit-row .unit{font-size:14px;color:var(--muted-ink);flex:none}

.check,.radio{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.55;cursor:pointer}
.check input,.radio input{appearance:none;width:20px;height:20px;flex:none;margin-top:1px;border:1.5px solid #AEBAB6;background:var(--white);border-radius:4px}
.radio input{border-radius:999px}
.check input:checked{background:#12805A;border-color:#12805A;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M1 5l3.4 3.4L11 1.6' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center}
.radio input:checked{border-color:#12805A;box-shadow:inset 0 0 0 4px var(--white),inset 0 0 0 12px #12805A}

.switch{position:relative;width:46px;height:26px;flex:none;display:inline-block}
.switch input{appearance:none;position:absolute;inset:0;margin:0;border-radius:999px;background:#C3CBC7;cursor:pointer;transition:background var(--t-fast)}
.switch input:checked{background:#12805A}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:999px;background:#fff;transition:transform var(--t-fast);pointer-events:none}
.switch:has(input:checked)::after{transform:translateX(20px)}

.stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--white);height:40px}
.stepper button{width:36px;height:100%;display:grid;place-items:center}
.stepper button[disabled]{color:#C3CBC7}
.stepper input{width:44px;height:100%;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);
  text-align:center;font-size:14px;min-height:auto;padding:0;border-radius:0;background:transparent}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{appearance:none;margin:0}

.range-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}
input[type=range]{width:100%;accent-color:#12805A;min-height:auto;padding:0;border:0;background:transparent}

/* ------------------------------------------------------------- 아코디언 */
.acc{display:grid;gap:10px}
.acc-item{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--white);overflow:hidden}
.night .acc-item,.night-deep .acc-item{background:rgba(231,239,236,.05);border-color:rgba(231,239,236,.14)}
.acc-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;text-align:left;font-size:15px;font-weight:600;min-height:56px}
.acc-btn .ind{flex:none;color:var(--muted-ink);transition:transform var(--t-fast)}
.night .acc-btn .ind,.night-deep .acc-btn .ind{color:var(--mint)}
.acc-btn[aria-expanded="true"] .ind{transform:rotate(45deg)}
.acc-panel{display:none;padding:0 18px 18px;font-size:14.5px;line-height:1.75;color:var(--muted-ink)}
.night .acc-panel,.night-deep .acc-panel{color:rgba(231,239,236,.72)}
.acc-panel.on{display:block}

/* ------------------------------------------------------------- 알림 띠 */
.notice{display:flex;gap:14px;align-items:flex-start;padding:18px 20px;border-radius:var(--r-md);background:var(--paper-2);font-size:14px;line-height:1.7}
.notice .ni{width:22px;height:22px;flex:none;margin-top:2px;color:var(--muted-ink)}
.notice strong{font-weight:700}
.notice-warn{background:rgba(255,112,77,.09);color:var(--orange-ink)}
.notice-warn .ni{color:var(--orange-ink)}
.notice-dark{background:var(--night);color:#E7EFEC}
.notice-dark .ni{color:var(--mint)}
.replace-flag{color:var(--orange-ink);font-weight:700}

.empty{display:grid;place-items:center;gap:12px;text-align:center;padding:44px 20px;border:1px dashed var(--line);border-radius:var(--r-md);color:var(--muted-ink)}

/* ------------------------------------------------------------- 홈 */
.dash-preview{display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:start}
.dash-shell{border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);overflow:hidden;display:grid;grid-template-columns:132px 1fr}
.dash-side{background:var(--paper-2);padding:18px 0;border-right:1px solid var(--line)}
.dash-side .dh{font-size:13px;font-weight:700;padding:0 16px 14px}
.dash-side a{display:flex;align-items:center;gap:9px;padding:9px 16px;font-size:13px;color:var(--muted-ink)}
.dash-side a[aria-current="true"]{background:var(--white);color:var(--graphite);font-weight:700}
.dash-side .di{width:16px;height:16px;flex:none}
.dash-body{padding:18px;display:grid;gap:14px}
.dash-body .drow{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mini-card{border:1px solid var(--line-soft);border-radius:var(--r-sm);padding:14px}
.mini-card .ml{font-size:12px;color:var(--muted-ink)}
.mini-card .mv{font-size:19px;font-weight:800;letter-spacing:-.03em;margin-top:5px}

/* 막대·선 그래프(순수 CSS/SVG) */
.spark{display:block;width:100%;height:64px}
.bars{display:flex;align-items:flex-end;gap:4px;height:64px}
.bars i{flex:1;background:var(--cobalt);border-radius:2px 2px 0 0;min-height:3px}
.bars.mintbars i{background:#3FBF8F}

.sol-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.sol-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;display:flex;flex-direction:column}
.sol-card .sc-top{padding:22px 20px 16px;text-align:center}
.sol-card h3{font-size:18px;color:#0B5C40;font-weight:700}
.sol-card p{font-size:13px;color:var(--muted-ink);margin-top:8px;line-height:1.6}
.sol-card .ib{border-radius:0;margin-top:auto}

.industry-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.industry-tile{position:relative;display:block;border-radius:var(--r-md);overflow:hidden;aspect-ratio:3/4}
.industry-tile img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-reveal)}
.industry-tile:hover img{transform:scale(1.03)}
.industry-tile .cap{position:absolute;inset:auto 0 0 0;padding:18px 16px;color:#fff;
  background:linear-gradient(to top,rgba(6,20,24,.9),rgba(6,20,24,0))}
.industry-tile .cap b{display:block;font-size:15px}
.industry-tile .cap span{display:block;font-size:12px;color:rgba(255,255,255,.78);margin-top:4px}

.plan-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.plan{border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);padding:24px;display:flex;flex-direction:column;position:relative}
.plan.pick{border-color:#37B98A;box-shadow:0 0 0 1px #37B98A inset}
.plan .pbadge{position:absolute;top:18px;right:18px}
.plan h3{font-size:21px;font-weight:800}
.plan .psub{font-size:13px;color:var(--muted-ink);margin-top:6px}
.plan .plist{margin:18px 0;display:grid;gap:8px}
.plan .plist li{font-size:13.5px;color:var(--muted-ink);display:flex;gap:8px}
.plan .plist li::before{content:"•";color:currentColor}
.plan .pprice{margin-top:auto;padding-top:16px;border-top:1px solid var(--line-soft)}
.plan .pprice .pv{font-size:26px;font-weight:800;letter-spacing:-.035em}
.plan .pprice .pm{font-size:14px;font-weight:600}
.plan .pnote{font-size:12.5px;color:var(--muted-ink);margin-top:6px}
.plan-starter h3,.plan-starter .pv,.plan-starter .pm{color:#0B7A52}
.plan-growth h3,.plan-growth .pv,.plan-growth .pm{color:var(--cobalt-ink)}
.plan-pro h3,.plan-pro .pv,.plan-pro .pm{color:var(--orange-ink)}

.case-band{display:grid;grid-template-columns:240px 200px 1fr;gap:32px;align-items:center}
.quote{font-size:17px;line-height:1.7;font-weight:600}

.arch-band{display:grid;grid-template-columns:300px 1fr;gap:44px;align-items:center}
.arch-rail{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0}
.arch-rail li{position:relative;text-align:center;padding:0 10px}
.arch-rail li + li::before{content:"";position:absolute;left:-12px;top:26px;width:24px;height:2px;background:var(--mint);opacity:.5}
.arch-rail .ai{width:56px;height:56px;border-radius:var(--r-pill);border:1px solid var(--night-line);display:grid;place-items:center;margin:0 auto 14px;color:var(--mint);background:rgba(124,242,196,.07)}
.arch-rail b{display:block;font-size:14.5px;color:#fff}
.arch-rail p{font-size:12px;color:rgba(231,239,236,.62);margin-top:6px;line-height:1.55}
.arch-foot{display:flex;justify-content:center;gap:0;margin-top:32px;border:1px solid var(--night-line);border-radius:var(--r-sm);flex-wrap:wrap}
.arch-foot li{padding:12px 24px;font-size:13px;color:rgba(231,239,236,.76);border-left:1px solid var(--night-line)}
.arch-foot li:first-child{border-left:0}

.access-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.access-3 .a3{display:grid;grid-template-columns:1fr 92px;gap:16px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:22px 24px}
.access-3 b{display:block;font-size:17px;font-weight:700}
.access-3 p{font-size:13px;color:var(--muted-ink);margin-top:8px;line-height:1.6}
.access-3 .ai{width:64px;height:64px;color:#12805A;justify-self:end}

.map-band{display:grid;grid-template-columns:1fr 1fr 1fr;gap:44px}
.kmap{width:100%;max-width:280px}
.kmap circle{fill:var(--mint)}
.kmap path{fill:rgba(124,242,196,.1);stroke:rgba(124,242,196,.45);stroke-width:1.4}

/* ------------------------------------------------------------- 솔루션 */
.hub{position:relative;aspect-ratio:1;max-width:460px;margin:0 auto;width:100%}
.hub-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:46%;aspect-ratio:1;
  display:grid;place-items:center;text-align:center;border:1.5px solid var(--mint);border-radius:var(--r-md);
  background:rgba(124,242,196,.08);padding:10px}
.hub-core .lat{font-size:17px;color:#fff}
.hub-core span{display:block;font-size:11.5px;color:var(--mint);margin-top:6px}
.hub-node{position:absolute;display:flex;align-items:center;gap:9px;width:max-content;max-width:44%}
.hub-node .hi{width:38px;height:38px;border-radius:var(--r-pill);border:1px solid var(--night-line);background:rgba(10,28,34,.9);
  display:grid;place-items:center;color:var(--mint);flex:none}
.hub-node b{display:block;font-size:13px;color:#fff}
.hub-node span{font-size:11px;color:rgba(231,239,236,.6)}

.sol-row{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--night-line);border-radius:var(--r-md);overflow:hidden;background:rgba(231,239,236,.03)}
.sol-row .sr-text{padding:28px 30px}
.sol-row .sr-text h3{color:var(--mint);font-size:21px}
.sol-row .sr-text .sub{font-size:14px;color:rgba(231,239,236,.78);margin:8px 0 18px}
.sol-row .sr-panel{padding:24px 26px;border-left:1px solid var(--night-line);display:grid;grid-template-columns:1fr 190px;gap:24px}
.sol-row .sr-media{border-left:1px solid var(--night-line)}
.stat-list{display:grid;gap:11px}
.stat-list li{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;color:rgba(231,239,236,.74);
  padding-bottom:9px;border-bottom:1px solid var(--night-line)}
.stat-list li:last-child{border-bottom:0;padding-bottom:0}
.stat-list b{color:#fff;font-weight:700}

.hw-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.hw-card{background:rgba(231,239,236,.04);border:1px solid var(--night-line);border-radius:var(--r-md);padding:18px;display:flex;flex-direction:column}
.hw-card .ib{margin-bottom:16px;background:rgba(255,255,255,.9)}
.hw-card h3{font-size:16px;color:#fff}
.hw-card .hs{font-size:12.5px;color:rgba(231,239,236,.6);margin:6px 0 12px}
.hw-card .dot-list{margin-bottom:16px}
.hw-card .btn{margin-top:auto}

.api-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.api-card{background:rgba(231,239,236,.04);border:1px solid var(--night-line);border-radius:var(--r-sm);padding:18px}
.api-card .ai{width:26px;height:26px;color:var(--mint);margin-bottom:12px}
.api-card b{display:block;font-size:14.5px;color:#fff}
.api-card p{font-size:12.5px;color:rgba(231,239,236,.62);margin-top:7px;line-height:1.6}

/* ------------------------------------------------------------- 출입·보안 */
.auth-methods{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.auth-methods li{background:rgba(231,239,236,.04);border:1px solid var(--night-line);border-radius:var(--r-md);padding:22px 16px;text-align:center}
.auth-methods .mi{width:40px;height:40px;margin:0 auto 14px;color:#fff}
.auth-methods b{display:block;font-size:14.5px;color:#fff}
.auth-methods span{font-size:12px;color:rgba(231,239,236,.6);display:block;margin-top:5px}

.detect-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.detect-grid .d{position:relative;border-radius:var(--r-sm);overflow:hidden;aspect-ratio:3/4}
.detect-grid img{width:100%;height:100%;object-fit:cover}
.detect-grid .cap{position:absolute;inset:auto 0 0 0;padding:14px 12px;color:#fff;font-size:13px;font-weight:600;
  background:linear-gradient(to top,rgba(6,20,24,.92),rgba(6,20,24,0))}
.detect-grid .cap span{display:block;font-size:11px;font-weight:400;color:rgba(255,255,255,.7);margin-top:4px}

.event-tl th,.event-tl td{border-bottom:1px solid var(--night-line);padding:12px 10px;font-size:13.5px}
.event-tl .sev{font-weight:700}

.privacy-2{display:grid;grid-template-columns:1fr 300px 1fr;gap:32px}
.sign{background:#F7F5EF;border:8px solid #7A5C3A;border-radius:6px;padding:22px 20px;color:#2A2620;font-size:12.5px;line-height:1.8}
.sign h4{font-size:16px;text-align:center;font-weight:800;margin-bottom:14px;letter-spacing:-.02em}
.sign .lat{display:block;text-align:center;margin-top:16px;font-size:13px;color:#5A5348}
.req-steps{display:grid;gap:14px}
.req-steps li{display:grid;grid-template-columns:34px 1fr;gap:14px}
.req-steps .rn{width:34px;height:34px;border-radius:var(--r-pill);border:1px solid var(--night-line);display:grid;place-items:center;font-size:13px;font-weight:700;color:var(--mint)}
.req-steps b{display:block;font-size:14.5px;color:#fff}
.req-steps p{font-size:12.5px;color:rgba(231,239,236,.62);margin-top:4px}

.dev-status{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.dev-status li{border:1px solid var(--night-line);border-radius:var(--r-md);padding:18px;text-align:center;background:rgba(231,239,236,.04)}
.dev-status b{display:block;font-size:14px;color:rgba(231,239,236,.78)}
.dev-status .st{font-size:19px;font-weight:800;color:var(--mint);margin:8px 0}
.dev-status .on{font-size:12px;color:rgba(231,239,236,.6);display:inline-flex;align-items:center;gap:6px}
.dev-status .on::before{content:"";width:7px;height:7px;border-radius:999px;background:var(--mint)}

.layout-pick{display:grid;grid-template-columns:200px 1fr 260px;gap:26px}
.layout-pick .lp li{padding:14px 16px;border:1px solid var(--night-line);border-radius:var(--r-sm);font-size:14px;margin-bottom:10px;color:rgba(231,239,236,.76)}
.layout-pick .lp li.on{background:rgba(124,242,196,.1);border-color:var(--mint);color:#fff;font-weight:600}
.legend{display:grid;gap:10px;font-size:13px;color:rgba(231,239,236,.72)}
.legend li{display:flex;align-items:center;gap:10px}
.legend .li{width:20px;height:20px;color:var(--mint);flex:none}

/* ------------------------------------------------------------- 키오스크 */
.kiosk-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.kiosk-stats .kv{font-size:34px;font-weight:800;color:var(--mint);letter-spacing:-.04em}
.kiosk-stats .kl{font-size:13px;color:rgba(231,239,236,.66);margin-top:6px}
.kiosk-stats .kd{font-size:12px;color:rgba(231,239,236,.5);margin-top:4px}

.feature-5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.feature-5 .f{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:22px 20px;display:flex;flex-direction:column}
.feature-5 .fi{width:44px;height:44px;border-radius:var(--r-pill);background:var(--paper-2);display:grid;place-items:center;color:#12805A;margin-bottom:16px}
.feature-5 h3{font-size:16px}
.feature-5 > .f > p{font-size:13px;color:var(--muted-ink);margin-top:9px;line-height:1.65}
.feature-5 .dot-list{margin-top:14px}
.feature-5 .ib{margin-top:16px}

.flow-cards{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;align-items:stretch}
.flow-cards li{position:relative;padding:0 12px}
.flow-cards li + li::before{content:"›";position:absolute;left:-4px;top:50%;transform:translateY(-50%);color:var(--muted-ink);font-size:20px}
.flow-cards .fc{height:100%;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:18px 16px}
.flow-cards .fh{font-size:14px;font-weight:700;text-align:center}
.flow-cards .fs{font-size:11.5px;color:var(--muted-ink);text-align:center;margin-top:5px;display:block}

.a11y-grid{display:grid;grid-template-columns:300px 1fr;gap:26px}
.a11y-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.a11y-cards .a{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px}
.a11y-cards .ai{width:34px;height:34px;color:#12805A;margin-bottom:12px}
.a11y-cards b{display:block;font-size:14.5px}
.a11y-cards p{font-size:12.5px;color:var(--muted-ink);margin-top:7px;line-height:1.6}

/* ------------------------------------------------------------- 운영 */
.ops-controls{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.ops-controls li{text-align:center;border:1px solid var(--line);border-radius:var(--r-md);padding:20px 12px;background:var(--white)}
.ops-controls .oi{width:34px;height:34px;margin:0 auto 12px;color:var(--graphite)}
.ops-controls b{display:block;font-size:14px}
.ops-controls span{font-size:12px;color:var(--muted-ink);display:block;margin-top:5px}

.donut{width:150px;height:150px;flex:none}
.donut-row{display:flex;gap:24px;align-items:center}
.donut-legend{display:grid;gap:9px;font-size:13px}
.donut-legend li{display:flex;align-items:center;gap:9px;justify-content:space-between}
.donut-legend .lk{display:flex;align-items:center;gap:8px}
.donut-legend i{width:10px;height:10px;border-radius:3px;display:inline-block}

.phone-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.phone{border:6px solid #1A2A2E;border-radius:18px;overflow:hidden;background:var(--night);aspect-ratio:9/17}
.phone .pin{padding:10px 8px;color:#E7EFEC;font-size:9px;display:grid;gap:6px;height:100%}
.phone .pv{font-size:13px;font-weight:800;color:#fff}
.phone .bars{height:34px}

/* ------------------------------------------------------------- 업종 */
.ind-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.ind-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;display:flex;flex-direction:column}
.ind-card .ic-media{position:relative}
.ind-card .ic-media .cap{position:absolute;inset:auto 0 0 0;padding:16px;color:#fff;font-size:17px;font-weight:700;
  background:linear-gradient(to top,rgba(6,20,24,.9),rgba(6,20,24,0))}
.ind-card .ic-media .cap i{font-style:normal;color:var(--mint);margin-right:8px;font-family:var(--f-lat)}
.ind-card .ic-body{padding:20px;display:flex;flex-direction:column;flex:1}
.ind-card .ic-body > p{font-size:13.5px;color:var(--muted-ink);line-height:1.65}
.ind-feats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0}
.ind-feats li{text-align:center;font-size:11.5px;color:var(--muted-ink)}
.ind-feats .fi{width:26px;height:26px;margin:0 auto 7px;color:#12805A}
.ind-card .ic-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;border-top:1px solid var(--line-soft);margin-top:auto;font-size:13px;color:var(--muted-ink)}

.mode-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.mode-3 .m{background:var(--night-card);border:1px solid var(--night-line);border-radius:var(--r-md);padding:26px;display:flex;flex-direction:column}
.mode-3 h3{color:var(--mint);font-size:20px}
.mode-3 > .m > p{font-size:13.5px;color:rgba(231,239,236,.72);margin:10px 0 16px;line-height:1.65}
.mode-3 .btn{margin-top:auto}

.mini-case{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.mini-case .mc{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px}
.mini-case .loc{font-size:13px;color:var(--muted-ink);margin:12px 0 10px}
.mini-case blockquote{font-size:13px;line-height:1.7;color:var(--graphite);min-height:88px}
.mini-case .kv{display:flex;justify-content:space-between;font-size:13px;padding:7px 0;border-top:1px solid var(--line-soft)}

.compliance-6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;border:1px solid var(--line);border-radius:var(--r-md);background:var(--white)}
.compliance-6 li{display:flex;gap:12px;align-items:center;padding:20px 18px;border-left:1px solid var(--line-soft);font-size:12.5px;line-height:1.5}
.compliance-6 li:first-child{border-left:0}
.compliance-6 .ci{width:28px;height:28px;flex:none;color:#12805A}

/* ------------------------------------------------------------- 요금 */
.billing-row{display:flex;align-items:center;gap:32px;flex-wrap:wrap;padding:22px 0}
.pricing-grid{display:grid;grid-template-columns:230px repeat(4,minmax(0,1fr));gap:18px;align-items:start}
.pricing-aside h2{font-size:26px}
.quote-calc{display:grid;grid-template-columns:1fr 1fr 300px;gap:24px}
.qline{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line-soft)}
.qline:last-child{border-bottom:0}
.qline .qn{display:flex;gap:12px;align-items:center}
.qline .qi{width:30px;height:30px;flex:none;color:var(--graphite)}
.qline b{display:block;font-size:14px}
.qline span{font-size:12px;color:var(--muted-ink)}
.qline .qp{font-size:14px;font-weight:700;min-width:110px;text-align:right}
.qtotal{background:var(--paper-2);border-radius:var(--r-md);padding:24px;text-align:center}
.qtotal .qv{font-size:30px;font-weight:800;letter-spacing:-.035em;margin:10px 0 4px}

.tco-row{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:22px}

/* ------------------------------------------------------------- 사례 */
.case-mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:120px;gap:10px}
.case-mosaic .cm{border-radius:var(--r-sm);overflow:hidden}
.case-mosaic .cm img{width:100%;height:100%;object-fit:cover}
.case-mosaic .tall{grid-row:span 2}
.case-filter{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:14px;align-items:center}
.case-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.case-card{background:rgba(231,239,236,.04);border:1px solid var(--night-line);border-radius:var(--r-md);overflow:hidden;display:flex;flex-direction:column}
.case-card .cc-body{padding:16px;display:flex;flex-direction:column;flex:1}
.case-card h3{font-size:16px;color:#fff;margin-top:10px}
.case-card .meta{font-size:12px;color:rgba(231,239,236,.6);margin-top:6px}
.case-card .kvs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.case-card .kvs .kl{font-size:11.5px;color:rgba(231,239,236,.58)}
.case-card .kvs .kv{font-size:15px;font-weight:800;color:var(--mint)}
.case-card .kvs .kv.neg{color:#7CC7F2}
.case-card .more{margin-top:auto;padding-top:14px}

.case-detail{display:grid;grid-template-columns:300px 1fr;gap:32px}
.iso-map{background:rgba(231,239,236,.04);border:1px solid var(--night-line);border-radius:var(--r-md);padding:20px}

/* ------------------------------------------------------------- 창업 가이드 */
.roadmap{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;position:relative;padding-top:6px}
.roadmap::before{content:"";position:absolute;left:4%;right:4%;top:22px;height:2px;background:var(--line)}
.roadmap li{text-align:center;position:relative;padding:0 4px}
.roadmap .rn{width:42px;height:42px;border-radius:var(--r-pill);border:2px solid var(--line);background:var(--white);
  display:grid;place-items:center;font-size:14px;font-weight:700;color:var(--muted-ink);margin:0 auto 14px;position:relative;z-index:1}
.roadmap li.on .rn{background:#12805A;border-color:#12805A;color:#fff}
.roadmap b{display:block;font-size:13px}
.roadmap span{font-size:11.5px;color:var(--muted-ink);display:block;margin-top:4px}

.guide-layout{display:grid;grid-template-columns:230px 1fr;gap:26px;align-items:start}
.guide-nav li a{display:flex;gap:10px;padding:11px 14px;font-size:13.5px;color:var(--muted-ink);border-radius:var(--r-sm)}
.guide-nav li a[aria-current="true"]{background:rgba(124,242,196,.16);color:#0B5C40;font-weight:700}
.guide-nav .n{font-variant-numeric:tabular-nums}

.check-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.check-cards .cc{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:18px}
.check-cards h4{font-size:14px;text-align:center;font-weight:700;margin-bottom:14px}
.check-cards li{display:flex;gap:9px;font-size:12.5px;padding:5px 0;color:var(--muted-ink)}
.check-cards .cs{width:15px;height:15px;border-radius:999px;border:1.5px solid var(--line);flex:none;margin-top:3px}
.check-cards li.done .cs{background:#12805A;border-color:#12805A}
.check-cards li.doing .cs{border-color:#E0A63C;background:#E0A63C}
.check-cards .cf{text-align:right;font-size:12px;color:var(--muted-ink);margin-top:12px;padding-top:10px;border-top:1px solid var(--line-soft)}

.store-types{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:14px}
.store-types a{display:block}
.store-types .st{position:relative;border-radius:var(--r-sm);overflow:hidden;aspect-ratio:4/3}
.store-types .st img{width:100%;height:100%;object-fit:cover}
.store-types .cap{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:12px;color:#fff;
  background:linear-gradient(to top,rgba(6,20,24,.85),rgba(6,20,24,.35))}
.store-types .cap b{font-size:13.5px}
.store-types .cap span{font-size:11px;color:rgba(255,255,255,.72);margin-top:4px}
.store-types .rec{font-size:11.5px;color:var(--muted-ink);text-align:center;margin-top:9px}

.gantt{font-size:12.5px}
.gantt td{padding:5px 3px}
.gantt .bar{height:20px;border-radius:3px;background:#3FBF8F}
.gantt th{font-weight:600;color:var(--muted-ink);font-size:12px;padding:6px 3px;text-align:center}
.gantt tbody th{text-align:left;white-space:nowrap;padding-right:12px}

/* ------------------------------------------------------------- 계산기 */
.calc-layout{display:grid;grid-template-columns:360px 1fr;gap:0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--white)}
.calc-inputs{background:var(--night);color:#E7EFEC;padding:28px 26px}
.calc-inputs .ci-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.calc-inputs label{font-size:13.5px;color:rgba(231,239,236,.78);display:flex;align-items:center;gap:9px}
.calc-inputs .cf{display:grid;grid-template-columns:1fr 150px;gap:12px;align-items:center;padding:9px 0}
.calc-inputs input,.calc-inputs select{background:rgba(231,239,236,.07);border-color:rgba(231,239,236,.18);color:#fff;min-height:42px;font-size:14px}
.calc-inputs input::placeholder{color:rgba(231,239,236,.4)}
.calc-inputs select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23E7EFEC' stroke-width='1.5'/%3E%3C/svg%3E")}
.calc-inputs .ci{width:18px;height:18px;color:var(--mint);flex:none}
.calc-results{padding:28px 30px}
.calc-kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.calc-kpi .k{border:1px solid var(--line);border-radius:var(--r-md);padding:18px}
.calc-kpi .kl{font-size:13px;color:var(--muted-ink)}
.calc-kpi .kv{font-size:24px;font-weight:800;letter-spacing:-.035em;margin-top:8px}
.calc-kpi .kd{font-size:12px;color:var(--muted-ink);margin-top:6px}
.calc-kpi .green .kv{color:#0B7A52}
.bep{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;text-align:center;background:var(--paper-2);border-radius:var(--r-md);padding:22px}
.bep .bv{font-size:26px;font-weight:800;color:#0B7A52;letter-spacing:-.035em}
.bep .bl{font-size:13px;color:var(--muted-ink);margin-top:6px}
.sens-row{display:grid;grid-template-columns:1fr 1.6fr auto;gap:16px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line-soft);font-size:13.5px}
.scenario-tbl td,.scenario-tbl th{text-align:center}
.scenario-tbl tbody th{text-align:left}
.scenario-tbl .pick{background:rgba(76,111,255,.07)}
.scenario-tbl .pick td{font-weight:700}

/* ------------------------------------------------------------- 구축 */
.survey-list li{display:grid;grid-template-columns:40px 120px 1fr;gap:14px;align-items:start;padding:14px 0;border-bottom:1px solid var(--line-soft);font-size:13px;color:var(--muted-ink)}
.survey-list li:last-child{border-bottom:0}
.survey-list .si{width:34px;height:34px;color:#12805A}
.survey-list b{color:var(--graphite);font-size:14px;font-weight:700}
.floorplan{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:18px}
.day-sched li{display:grid;grid-template-columns:64px 1fr;gap:16px;font-size:13.5px;padding:9px 0;position:relative}
.day-sched .t{color:#12805A;font-weight:700;font-variant-numeric:tabular-nums}
.role-tbl td{font-size:13px}
.dur-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.dur-3 .d{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:24px;text-align:center}
.dur-3 h3{font-size:18px;color:#0B7A52}
.dur-3 .sub{font-size:12.5px;color:var(--muted-ink);margin-top:6px}
.dur-3 .dots{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;margin:22px 0 10px;position:relative}
.dur-3 .dots::before{content:"";position:absolute;left:10%;right:10%;top:6px;height:2px;background:#B7E9D3}
.dur-3 .dots li{position:relative;text-align:center;font-size:11px;color:var(--muted-ink)}
.dur-3 .dots i{display:block;width:13px;height:13px;border-radius:999px;border:2px solid #3FBF8F;background:var(--white);margin:0 auto 10px;position:relative;z-index:1}
.dur-3 .val{font-size:24px;font-weight:800;color:#0B7A52;letter-spacing:-.03em}

/* ------------------------------------------------------------- 지원 */
.support-hero-panel{background:rgba(10,28,34,.9);border:1px solid var(--night-line);border-radius:var(--r-md);padding:24px}
.sev-row{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:26px;align-items:center;background:var(--night-card);
  border:1px solid var(--night-line);border-radius:var(--r-md);padding:20px 24px}
.sev-list{display:flex;gap:26px;flex-wrap:wrap}
.sev-list li{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:rgba(231,239,236,.66)}
.sev-list .sd{width:11px;height:11px;border-radius:999px;flex:none;margin-top:4px}
.sev-list b{display:block;color:#fff;font-size:13.5px}
.contact-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.contact-4 .c{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:24px;text-align:center}
.contact-4 .ci{width:40px;height:40px;margin:0 auto 14px;color:#12805A}
.contact-4 h3{font-size:17px;color:#0B7A52}
.contact-4 p{font-size:12.5px;color:var(--muted-ink);margin-top:8px;line-height:1.6}
.contact-4 .hrs{font-size:12px;color:var(--muted-ink);margin-top:14px;padding-top:12px;border-top:1px solid var(--line-soft)}
.contact-4 .hv{font-size:15px;font-weight:700;color:var(--graphite);display:block;margin-top:4px}
.dev-health{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.dev-health .d{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:18px}
.dev-health .dh{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dev-health .dm{font-size:12px;color:var(--muted-ink);margin-top:8px}
.dev-health .dl2{display:flex;justify-content:space-between;font-size:12.5px;padding:6px 0;border-top:1px solid var(--line-soft);margin-top:10px}
.helpdesk-7{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:14px}
.helpdesk-7 a{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px 12px;text-align:center}
.helpdesk-7 .hi{width:30px;height:30px;margin:0 auto 12px;color:var(--graphite)}
.helpdesk-7 b{display:block;font-size:13.5px}
.helpdesk-7 span{font-size:11.5px;color:var(--muted-ink);display:block;margin-top:5px}
.ticket-list li{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line-soft)}
.ticket-list .sv{width:32px;height:26px;border-radius:5px;display:grid;place-items:center;font-size:11.5px;font-weight:700}
.sv-s1{background:rgba(255,112,77,.16);color:var(--orange-ink)}
.sv-s2{background:rgba(224,166,60,.2);color:#8A6318}
.sv-s3{background:rgba(76,111,255,.14);color:var(--cobalt-ink)}
.sv-s4{background:rgba(114,128,128,.16);color:var(--muted-ink)}
.ticket-list .tt{font-size:13.5px;font-weight:600}
.ticket-list .tm{font-size:11.5px;color:var(--muted-ink);margin-top:3px}

/* ------------------------------------------------------------- 회사 */
.mission{display:grid;grid-template-columns:300px 1fr;gap:44px}
.principle-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.principle-4 .p{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:24px}
.principle-4 .pi{width:36px;height:36px;color:#12805A;margin-bottom:14px}
.principle-4 b{display:block;font-size:16px}
.principle-4 p{font-size:12.5px;color:var(--muted-ink);margin-top:8px;line-height:1.6}
.brand-tl{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;position:relative;padding-top:6px}
.brand-tl::before{content:"";position:absolute;left:8%;right:8%;top:7px;height:2px;background:#B7E9D3}
.brand-tl li{position:relative;padding-right:20px}
.brand-tl i{display:block;width:14px;height:14px;border-radius:999px;background:#12805A;margin-bottom:20px;position:relative;z-index:1}
.brand-tl .yr{font-size:16px;font-weight:800;color:#0B7A52}
.brand-tl b{display:block;font-size:14px;margin-top:8px}
.brand-tl p{font-size:12.5px;color:var(--muted-ink);margin-top:7px;line-height:1.6}
.team-6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.team-6 .t{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.team-6 .tb{padding:16px}
.team-6 b{display:block;font-size:15px}
.team-6 .role{font-size:12.5px;color:var(--muted-ink);margin-top:3px}
.team-6 p{font-size:12px;color:var(--muted-ink);margin-top:9px;line-height:1.55}

/* ------------------------------------------------------------- 상담 */
.consult-layout{display:grid;grid-template-columns:1fr 340px;gap:26px;align-items:start}
.consult-steps{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;position:relative;margin:24px 0 34px;padding-top:4px}
.consult-steps::before{content:"";position:absolute;left:7%;right:7%;top:21px;height:2px;background:var(--line)}
.consult-steps li{text-align:center;position:relative}
.consult-steps .cn{width:42px;height:42px;border-radius:var(--r-pill);border:2px solid var(--line);background:var(--white);
  display:grid;place-items:center;font-size:14px;font-weight:700;color:var(--muted-ink);margin:0 auto 12px;position:relative;z-index:1}
.consult-steps li.on .cn{background:#12805A;border-color:#12805A;color:#fff}
.consult-steps b{font-size:13px;font-weight:600;color:var(--muted-ink)}
.consult-steps li.on b{color:var(--graphite);font-weight:700}
.purpose-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.purpose-3 label{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;border:1px solid var(--line);
  border-radius:var(--r-md);padding:20px;background:var(--white);cursor:pointer}
.purpose-3 label:has(input:checked){border-color:#37B98A;background:rgba(124,242,196,.08)}
.purpose-3 b{display:block;font-size:15px;color:#0B7A52}
.purpose-3 p{font-size:12.5px;color:var(--muted-ink);margin-top:6px;line-height:1.55}
.pick-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.pick-grid button{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--white);padding:12px 14px;font-size:13.5px;min-height:48px;font-weight:600}
.pick-grid button[aria-pressed="true"]{border-color:#37B98A;background:rgba(124,242,196,.14);color:#0B5C40}
.pick-grid .pi{width:20px;height:20px;flex:none;color:var(--muted-ink)}
.pick-grid button[aria-pressed="true"] .pi{color:#0B5C40}
.func-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.func-grid label{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--white);padding:12px 14px;font-size:13px;min-height:48px}
.func-grid label:has(input:checked){border-color:#37B98A;background:rgba(124,242,196,.1)}
.map-ph{background:var(--paper-2);border:1px dashed var(--line);border-radius:var(--r-md);min-height:180px;
  display:grid;place-items:center;text-align:center;color:var(--muted-ink);font-size:13px;gap:6px}
.summary-side .sv{display:grid;grid-template-columns:70px 1fr;gap:10px 14px;font-size:13.5px}
.summary-side dt{color:var(--muted-ink)}
.est-row{display:flex;justify-content:space-between;font-size:14px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.est-row b{font-weight:700}
.advisor-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.advisor-3 .a{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px;display:grid;grid-template-columns:76px 1fr;gap:16px;align-items:start}
.advisor-3 b{display:block;font-size:15px}
.advisor-3 .dot-list{margin-top:8px}
.advisor-3 .btn{grid-column:1/-1;margin-top:6px}

/* ------------------------------------------------------------- 콘솔 */
.console-shell{display:grid;grid-template-columns:230px 1fr;min-height:100vh}
.console-side{background:var(--night-deep);color:#E7EFEC;padding:22px 0;position:sticky;top:0;align-self:start;max-height:100vh;overflow-y:auto}
.console-side .cs-brand{padding:0 20px 18px}
.console-side h2{font-size:17px;font-weight:700;padding:0 20px 16px}
.console-side nav a{display:flex;align-items:center;gap:11px;padding:11px 20px;font-size:14px;color:rgba(231,239,236,.78)}
.console-side nav a:hover{background:rgba(231,239,236,.06);color:#fff}
.console-side nav a[aria-current="page"]{background:rgba(124,242,196,.14);color:var(--mint);font-weight:700}
.console-side .ci{width:18px;height:18px;flex:none}
.console-side .badge{margin-left:auto;background:var(--orange);color:#fff;font-size:11px;font-weight:700;border-radius:999px;padding:1px 7px}
.console-side .cs-stores{margin-top:22px;padding:18px 20px 0;border-top:1px solid rgba(231,239,236,.12);font-size:13px}
.console-side .cs-stores a{padding:8px 0;color:rgba(231,239,236,.66)}
.console-help{margin:22px 16px 0;background:var(--night-card);border:1px solid var(--night-line);border-radius:var(--r-md);padding:16px}
.console-help p{font-size:12px;color:rgba(231,239,236,.66);line-height:1.6}
.console-main{background:#F7F9F8;min-width:0}
.console-top{background:var(--white);border-bottom:1px solid var(--line);padding:14px 26px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.console-top .sel{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 14px;font-size:14px;font-weight:600;background:var(--white)}
.console-body{padding:26px}
.console-body > section{margin-bottom:22px}
.feed-tbl th,.feed-tbl td{font-size:13px;padding:12px 10px}
.feed-tbl .ev{display:flex;gap:10px;align-items:flex-start}
.feed-tbl .evi{width:18px;height:18px;flex:none;margin-top:2px}
.feed-tbl b{display:block;font-size:13.5px}
.feed-tbl .sub{font-size:11.5px;color:var(--muted-ink);margin-top:3px}
.snap-list{display:grid;gap:12px}
.snap-list li{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center}
.snap-list .sm{aspect-ratio:16/10;border-radius:var(--r-sm);overflow:hidden;background:var(--paper-2);filter:blur(1.5px)}
.snap-list .sm img{width:100%;height:100%;object-fit:cover}
.snap-list .st{font-size:12px;font-variant-numeric:tabular-nums}
.snap-list .sl{font-size:12px;color:var(--muted-ink);margin-top:3px}
.remote-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.remote-card{border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);padding:18px;text-align:center}
.remote-card b{display:block;font-size:14.5px}
.remote-card .rs{font-size:12px;color:var(--muted-ink);margin-top:5px}
.remote-card .ri2{width:40px;height:40px;margin:16px auto;color:var(--graphite)}
.audit-tbl td,.audit-tbl th{font-size:12.5px;padding:10px 8px}
.rank-bar{display:grid;grid-template-columns:20px 1fr 120px auto;gap:12px;align-items:center;padding:10px 0;font-size:13.5px}
.rank-bar .rb{height:8px;border-radius:999px;background:var(--line-soft);overflow:hidden}
.rank-bar .rb i{display:block;height:100%;background:var(--night);border-radius:999px}
.modal-demo{position:relative;background:var(--night);color:#E7EFEC;border-radius:var(--r-md);padding:24px;max-width:420px}
.modal-demo .md-close{position:absolute;right:16px;top:16px;color:rgba(231,239,236,.7)}
.modal-demo h3{font-size:17px;color:#fff}
.modal-demo p{font-size:13.5px;color:rgba(231,239,236,.72);margin-top:10px;line-height:1.7}
.modal-demo .md-acts{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}
.state-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.state-4 .s{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px}
.state-4 h4{font-size:14px;font-weight:700;margin-bottom:12px}
.spinner{width:34px;height:34px;border-radius:999px;border:3px solid var(--line);border-top-color:#12805A;margin:14px auto;animation:spin 900ms linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ------------------------------------------------------------- 정책 */
.pol-layout{display:grid;grid-template-columns:250px 1fr;gap:32px;align-items:start}
.pol-nav a{display:flex;align-items:center;gap:11px;padding:13px 16px;font-size:14px;color:var(--muted-ink);border-radius:var(--r-sm)}
.pol-nav a[aria-current="true"]{background:rgba(124,242,196,.2);color:#0B5C40;font-weight:700}
.pol-nav .pi{width:20px;height:20px;flex:none}
.pol-ask{margin-top:22px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px}
.pol-tools{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.pol-tools select{width:auto;min-width:150px;min-height:44px}
.pol-body h2{font-size:22px;margin-top:34px}
.pol-body h2:first-child{margin-top:0}
.pol-body h3{font-size:16px;margin:24px 0 10px}
.pol-body p,.pol-body li{font-size:14px;line-height:1.85;color:#3A4443}
.pol-body ul.dash li{padding-left:13px;position:relative}
.pol-body ul.dash li::before{content:"•";position:absolute;left:0;color:var(--muted-ink)}
.pol-body .sub{color:var(--muted-ink);font-size:14px;margin-top:6px}

/* ------------------------------------------------------------- CTA 띠 */
.cta-band{background:var(--night);color:#E7EFEC;border-radius:var(--r-lg);padding:34px 40px;display:grid;
  grid-template-columns:1fr auto auto;gap:32px;align-items:center}
.cta-band h2{font-size:26px;color:#fff}
.cta-band p{font-size:14px;color:rgba(231,239,236,.68);margin-top:8px}
.cta-band .cb-feats{display:flex;gap:26px}
.cta-band .cb-feats li{text-align:center;font-size:12px;color:rgba(231,239,236,.72)}
.cta-band .cb-feats .fi{width:30px;height:30px;margin:0 auto 9px;color:var(--mint)}
.cta-band .cb-act{display:grid;gap:10px;justify-items:stretch}
.cta-band .tel{font-size:13px;color:rgba(231,239,236,.72);display:flex;align-items:center;gap:8px}
.cta-band .tel b{color:#fff;font-size:15px}

/* ------------------------------------------------------------- 푸터 */
.site-footer{background:var(--night-deep);color:#E7EFEC;padding:56px 0 34px}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr) 1.1fr;gap:32px}
.footer-brand p{font-size:13px;color:rgba(231,239,236,.62);margin-top:14px;line-height:1.75}
.footer-sns{display:flex;gap:10px;margin-top:20px}
.footer-sns a{width:34px;height:34px;border-radius:var(--r-pill);background:rgba(231,239,236,.09);display:grid;place-items:center;color:#E7EFEC}
.footer-sns a:hover{background:var(--mint);color:var(--night)}
.fcol h3{font-size:14px;font-weight:700;margin-bottom:14px;color:#fff}
.fcol li{margin-bottom:9px}
.fcol a,.fcol span{font-size:13px;color:rgba(231,239,236,.66)}
.fcol a:hover{color:var(--mint)}
.footer-contact .ct{font-size:19px;font-weight:800;color:#fff;letter-spacing:-.02em;margin-top:4px}
.footer-contact .ch{font-size:12.5px;color:rgba(231,239,236,.6);margin-top:6px}
.footer-legal{margin-top:40px;padding-top:22px;border-top:1px solid rgba(231,239,236,.12);
  display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;justify-content:space-between;font-size:12.5px;color:rgba(231,239,236,.6)}
.footer-legal .biz{display:flex;flex-wrap:wrap;gap:6px 14px}
.footer-legal .biz span{position:relative}
.footer-legal .biz span + span::before{content:"|";position:absolute;left:-9px;opacity:.4}

/* 모바일 하단 고정 CTA */
.mobile-cta{position:fixed;left:0;right:0;bottom:0;z-index:90;display:none;gap:10px;
  background:var(--night-deep);border-top:1px solid var(--night-line);
  padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom))}
.mobile-cta .btn{flex:1}
body.has-mcta{padding-bottom:76px}

/* ------------------------------------- 어두운 면 위 글자 대비 교정 (실측 검거)
   밝은 면 기준으로 정한 먹색(--muted-ink, --mint-ink, --orange-ink)이
   어두운 카드 안에 그대로 들어가면 2.2~3.2:1 로 떨어진다. 어두운 면을 만드는
   부품을 한 곳에 모아 색을 뒤집는다. */
.night, .night-deep, .hero, .card-dark, .sol-row, .case-card, .mode-3 .m,
.cta-band, .console-side, .live-panel, .support-hero-panel, .modal-demo,
.site-footer, .site-header, .drawer, .calc-inputs, .metric-strip,
.hw-card, .api-card, .hotspots li, .sev-row, .plain-dark{
  --muted-ink:rgba(231,239,236,.72);
  --mint-ink:var(--mint);
  --orange-ink:#FF9478;
  --cobalt-ink:#9BB0FF;
}
.night .tag-mint,.night-deep .tag-mint,.card-dark .tag-mint,.sol-row .tag-mint,
.case-card .tag-mint,.cta-band .tag-mint,.live-panel .tag-mint,.calc-inputs .tag-mint,
.support-hero-panel .tag-mint,.hero .tag-mint,.console-side .tag-mint{
  background:rgba(124,242,196,.18);color:var(--mint)
}
.night .tag-sample,.night-deep .tag-sample,.card-dark .tag-sample,.sol-row .tag-sample,
.case-card .tag-sample,.cta-band .tag-sample,.live-panel .tag-sample,.calc-inputs .tag-sample,
.support-hero-panel .tag-sample,.hero .tag-sample,.console-side .tag-sample,.notice-dark .tag-sample{
  background:rgba(124,242,196,.16);color:var(--mint);border-color:var(--night-line)
}
.calc-inputs .tabs [aria-pressed="true"],.calc-inputs .tabs [aria-selected="true"],
.card-dark .tabs [aria-pressed="true"],.sol-row .tabs [aria-pressed="true"],
.hero .tabs [aria-pressed="true"],.support-hero-panel .tabs [aria-pressed="true"]{
  background:var(--mint);border-color:var(--mint);color:#06231A
}
.calc-inputs .chip[aria-pressed="true"],.card-dark .chip[aria-pressed="true"],
.sol-row .chip[aria-pressed="true"],.hero .chip[aria-pressed="true"]{
  background:rgba(124,242,196,.18);border-color:var(--mint);color:var(--mint)
}
.night .tag-grey,.night-deep .tag-grey,.card-dark .tag-grey,.case-card .tag-grey,
.sol-row .tag-grey,.hero .tag-grey{background:rgba(231,239,236,.14);color:rgba(231,239,236,.82)}
.night .tag-cobalt,.night-deep .tag-cobalt,.card-dark .tag-cobalt,.case-card .tag-cobalt{
  background:rgba(155,176,255,.18);color:#B9C8FF}
.night .tag-orange,.night-deep .tag-orange,.card-dark .tag-orange,.case-card .tag-orange{
  background:rgba(255,148,120,.18);color:#FFB09A}
.cta-band .mint,.hero .mint,.console-side .mint,.live-panel .mint{color:var(--mint)}
.site-footer .replace-flag{color:#FF9478}

/* 흰 글자를 얹는 단추 바탕 — 4.5:1 을 넘기도록 한 단계 깊게 */
.btn-cobalt{background:#3B5AE0}
.btn-orange{background:#C1421F}
.console-side .badge,.console-top .badge{background:#C1421F}

/* ------------------------------------------- 줄바꿈 교정 (실캡처에서 검거)
   <span> 을 두 줄짜리 라벨/값으로 쓴 자리들 — inline 으로 남으면 값과 설명이
   한 줄에 붙어버린다(예: 「24/365실시간 관제」). */
.metric-strip .mv,.metric-strip .ml,
.ticket-list .tt,.ticket-list .tm,
.snap-list .st,.snap-list .sl{display:block}

/* ------------------------------------------------------------- 반응형 */
@media (max-width:1199px){
  :root{--sec:88px}
  .display{font-size:48px}
  h1,.h1{font-size:40px}
  h2,.h2{font-size:30px}
  h3,.h3{font-size:22px}
  .gnb{display:none}
  .header-cta .btn:not(.btn-mint){display:none}
  .menu-btn{display:grid}
  /* 인라인으로 잡은 다단 격자는 좁은 폭에서 반드시 풀려야 한다.
     안 풀면 320px 고정 칸이 남아 지면을 밀어낸다(실측 검거). */
  .grid[style*="grid-template-columns"],
  section[style*="grid-template-columns"],
  .wrap[style*="grid-template-columns"]{grid-template-columns:1fr!important}
  .tbl-scroll{min-width:0;max-width:100%}
  .hero-media{inset:0}
  .hero-media::after{background:linear-gradient(90deg,var(--night-deep) 2%,rgba(6,20,24,.92) 40%,rgba(6,20,24,.6) 100%)}
  .kpi,.metric-strip,.sol-cards,.feature-5,.industry-strip,.hw-grid,.case-cards,.mini-case,
  .plan-cards,.detect-grid,.remote-grid,.dev-health,.helpdesk-7,.store-types,.team-6,
  .compliance-6,.ops-controls,.phone-strip,.g4,.g5,.g6,.g7{grid-template-columns:repeat(3,minmax(0,1fr))}
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dl{grid-template-columns:1fr;gap:2px 0}
  .dl dt{margin-top:10px}
  .dl dd,.tbl td,.tbl th{overflow-wrap:anywhere}
  .tbl th,.tbl td{padding:11px 10px}
  .metric-strip li{border-left:0;border-top:1px solid var(--night-line)}
  .metric-strip li:nth-child(-n+3){border-top:0}
  .compliance-6 li{border-left:0;border-top:1px solid var(--line-soft)}
  .compliance-6 li:nth-child(-n+3){border-top:0}
  .dash-preview,.arch-band,.mission,.a11y-grid,.case-detail,.guide-layout,.consult-layout,
  .pol-layout,.privacy-2,.layout-pick,.quote-calc,.tco-row,.map-band,.calc-layout,.pricing-grid,
  .case-band,.sev-row{grid-template-columns:1fr}
  .sev-row{align-items:flex-start;gap:18px}
  .sol-row,.sol-row .sr-panel,.access-3,.ind-cards,.mode-3,.api-grid,.contact-4,.principle-4,
  .a11y-cards,.check-cards,.dur-3,.calc-kpi,.auth-methods,.dev-status,.state-4,.advisor-3,
  .purpose-3,.pick-grid,.func-grid,.case-filter{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sol-row .sr-panel,.sol-row .sr-media{border-left:0;border-top:1px solid var(--night-line)}
  .rail,.steps-line,.roadmap,.arch-rail,.brand-tl,.consult-steps,.flow-cards{grid-auto-flow:row;grid-auto-columns:auto;gap:22px}
  .rail li + li::before,.steps-line::before,.roadmap::before,.arch-rail li + li::before,
  .brand-tl::before,.consult-steps::before,.flow-cards li + li::before,.dur-3 .dots::before{display:none}
  .footer-grid{grid-template-columns:repeat(3,1fr)}
  .console-shell{grid-template-columns:1fr}
  .console-side{position:static;max-height:none}
  .cta-band{grid-template-columns:1fr}
  .hub{max-width:340px}
  .hub-node{position:static;max-width:none}
  .hub{aspect-ratio:auto;display:grid;gap:12px;max-width:none}
  .hub-core{position:static;transform:none;width:100%;aspect-ratio:auto;padding:20px}
}

@media (max-width:767px){
  :root{--sec:var(--sec-m);--gutter:20px}
  .display{font-size:38px;line-height:1.21}
  h1,.h1{font-size:32px}
  h2,.h2{font-size:25px}
  h3,.h3{font-size:20px}
  .hero-in{padding:56px var(--gutter) 64px}
  .hero .lede{font-size:15.5px}
  .hero .cta-row .btn{flex:1 1 100%}
  .kpi,.metric-strip,.sol-cards,.feature-5,.industry-strip,.hw-grid,.case-cards,.mini-case,
  .plan-cards,.detect-grid,.remote-grid,.dev-health,.helpdesk-7,.store-types,.team-6,
  .compliance-6,.ops-controls,.phone-strip,.g3,.g4,.g5,.g6,.g7,.auth-methods,.dev-status,
  .a11y-cards,.check-cards,.calc-kpi,.api-grid,.pick-grid,.func-grid,.case-filter,
  .access-3,.ind-cards,.mode-3,.contact-4,.principle-4,.dur-3,.state-4,.advisor-3,
  .purpose-3,.bep,.tco-row,.sol-row,.g2{grid-template-columns:1fr}
  .kiosk-stats{grid-template-columns:1fr;gap:18px}
  .metric-strip li:nth-child(-n+3){border-top:1px solid var(--night-line)}
  .metric-strip li:first-child{border-top:0}
  .compliance-6 li:nth-child(-n+3){border-top:1px solid var(--line-soft)}
  .compliance-6 li:first-child{border-top:0}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-brand,.footer-contact{grid-column:1/-1}
  .between{flex-wrap:wrap}
  /* 모바일에서는 하단 고정 CTA 가 그 역할을 하므로 머리띠의 단추를 접는다 */
  .header-cta .btn{display:none}
  .header-in{gap:12px}
  [style*="grid-template-columns"]{grid-template-columns:1fr!important}
  .dash-shell{grid-template-columns:1fr}
  .dash-side{display:flex;gap:6px;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);padding:12px}
  .dash-side .dh{display:none}
  .dash-side a{white-space:nowrap;padding:8px 12px}
  .dash-body .drow{grid-template-columns:1fr}
  .case-mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:96px}
  .cta-band{padding:26px 22px}
  .cta-band .cb-feats{flex-wrap:wrap;gap:16px}
  .cta-band .cb-feats li{flex:1 1 40%}
  .hero-pills{width:100%;border-radius:var(--r-md)}
  .hero-pills li{border-left:0;flex:1 1 44%}
  .tbl-scroll table{min-width:620px}
  .gantt{min-width:560px}
  .sign{padding:16px}
  .mobile-cta{display:flex}
  .console-body{padding:18px var(--gutter)}
  .console-top{padding:12px var(--gutter)}
  .arch-foot li{border-left:0;border-top:1px solid var(--night-line);width:100%;text-align:center}
  .arch-foot li:first-child{border-top:0}
  .dl{grid-template-columns:1fr;gap:4px 0}
  .dl dt{margin-top:10px}
  .snap-list li{grid-template-columns:88px 1fr}
  .qline{grid-template-columns:1fr;gap:10px}
  .qline .qp{text-align:left}
  .sens-row{grid-template-columns:1fr;gap:8px}
  .calc-inputs .cf{grid-template-columns:1fr;gap:6px}
  .btn-w220{min-width:0;width:100%}
  .survey-list li{grid-template-columns:34px 1fr}
  .survey-list li > b{grid-column:2}
  .day-sched li{grid-template-columns:56px 1fr}
  .advisor-3 .a{grid-template-columns:64px 1fr}
  .footer-legal{flex-direction:column;align-items:flex-start}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .industry-tile:hover img,.sol-card:hover img{transform:none}
}

@media print{
  .site-header,.site-footer,.drawer,.scrim,.mobile-cta,.console-side{display:none!important}
  body{background:#fff}
}

/* ── 좁은 데스크톱(1024~1360) 정렬 보강 — 0823 미리보기 사건 후속 ─────────────
   칸이 좁아져 글줄 수가 카드마다 갈리면 아래 부품이 밀린다. 열 수를 먼저 줄이고,
   바닥 단추류는 바닥선에 고정한다. 모바일(≤767)의 1열 쌓기 규칙을 침범하지 않게
   대역을 아래로도 막는다 — 파일 끝 추가라 그냥 두면 모바일 규칙을 이겨버린다. */
@media (min-width:768px) and (max-width:1120px){
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .feature-5{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1320px){
  .kpi .kv{font-size:21px}                    /* 3,245,800원 이 한 줄에 들어가는 크기 */
  .remote-card b{min-height:2.9em}            /* 두 줄 이름 칸을 상시 확보 */
}
/* 카드 바닥 단추(btn-block)는 본문 길이와 무관하게 같은 바닥선에 */
.card.card-pad:has(> .btn-block){display:flex;flex-direction:column}
.card.card-pad > .btn-block{margin-top:auto}
.remote-card{display:flex;flex-direction:column}
.remote-card .btn{margin-top:auto}
.remote-card .rs{margin-bottom:8px}
/* 원격 제어 칸 — 이름 두 줄 시 촘촘한 행간으로 상자(2.9em)에 정확히 들어가고,
   단추 글자는 절대 줄바꿈하지 않는다 */
.remote-card b{line-height:1.45}
.remote-card .btn{white-space:nowrap}
/* 3열이 된 feature-5(≤1120)는 설명 두 줄 상자를 상시 확보 — 목록 시작 y 통일 */
@media (min-width:768px) and (max-width:1120px){ .feature-5 .f p{min-height:3.1em} }
/* 카드 꼬리의 「자세히 보기」류 링크도 바닥선 고정 — <p><a.more> 로 한 겹 싸인 꼴 포함 */
.card.card-pad:has(> a.more),.card.card-pad:has(> p > a.more:only-child){display:flex;flex-direction:column}
.card.card-pad > a.more{margin-top:auto;padding-top:10px}
.card.card-pad > p:has(> a.more:only-child){margin-top:auto !important;padding-top:4px}