.elementor-26136 .elementor-element.elementor-element-46599f5:not(.elementor-motion-effects-element-type-background), .elementor-26136 .elementor-element.elementor-element-46599f5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-0c99566 );}.elementor-26136 .elementor-element.elementor-element-46599f5 > .elementor-container{min-height:100px;}.elementor-26136 .elementor-element.elementor-element-46599f5{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-26136 .elementor-element.elementor-element-46599f5 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-26136 .elementor-element.elementor-element-7c0fc39 .elementor-button{background-color:#301E1C;font-size:0.8em;font-weight:700;fill:#FFFFFF;color:#FFFFFF;}.elementor-26136 .elementor-element.elementor-element-7c0fc39 .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-7c0fc39 .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-7c0fc39{width:100%;max-width:100%;}.elementor-26136 .elementor-element.elementor-element-7dd844e .elementor-button{background-color:#301E1C;font-size:0.8em;font-weight:700;fill:#FFFFFF;color:#FFFFFF;}.elementor-26136 .elementor-element.elementor-element-7dd844e .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-7dd844e .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-7dd844e{width:100%;max-width:100%;}.elementor-26136 .elementor-element.elementor-element-e12cfad .elementor-button{background-color:#301E1C;font-size:0.8em;font-weight:700;fill:#FFFFFF;color:#FFFFFF;}.elementor-26136 .elementor-element.elementor-element-e12cfad .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-e12cfad .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-e12cfad{width:100%;max-width:100%;}.elementor-26136 .elementor-element.elementor-element-2793dd1 .elementor-button{background-color:#301E1C;font-size:0.8em;font-weight:700;fill:#FFFFFF;color:#FFFFFF;}.elementor-26136 .elementor-element.elementor-element-2793dd1 .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-2793dd1 .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-2793dd1{width:100%;max-width:100%;}.elementor-26136 .elementor-element.elementor-element-fd8b4e1 .elementor-button{background-color:#301E1C;font-size:0.8em;font-weight:700;fill:#FFFFFF;color:#FFFFFF;}.elementor-26136 .elementor-element.elementor-element-fd8b4e1 .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-fd8b4e1 .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-fd8b4e1{width:100%;max-width:100%;}.elementor-26136 .elementor-element.elementor-element-35a5eed .elementor-button{background-color:#301E1C;font-size:0.8em;font-weight:700;fill:#FFFFFF;color:#FFFFFF;}.elementor-26136 .elementor-element.elementor-element-35a5eed .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-35a5eed .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-35a5eed{width:100%;max-width:100%;}.elementor-26136 .elementor-element.elementor-element-ade95d9 .elementor-button{background-color:#301E1C;font-size:0.8em;font-weight:700;fill:#FFFFFF;color:#FFFFFF;}.elementor-26136 .elementor-element.elementor-element-ade95d9 .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-ade95d9 .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-ade95d9{width:100%;max-width:100%;}.elementor-26136 .elementor-element.elementor-element-5ef5f96 .elementor-button{background-color:#301E1C;font-size:0.8em;font-weight:700;fill:#FFFFFF;color:#FFFFFF;}.elementor-26136 .elementor-element.elementor-element-5ef5f96 .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-5ef5f96 .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-5ef5f96{width:100%;max-width:100%;}.elementor-26136 .elementor-element.elementor-element-5eccaec .elementor-button{background-color:#301E1C;font-size:0.8em;font-weight:700;fill:#FFFFFF;color:#FFFFFF;}.elementor-26136 .elementor-element.elementor-element-5eccaec .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-5eccaec .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-5eccaec{width:100%;max-width:100%;}.elementor-26136 .elementor-element.elementor-element-a8e2aeb > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:flex-end;align-items:flex-end;}.elementor-26136 .elementor-element.elementor-element-a8e2aeb:hover > .elementor-background-overlay{opacity:0.5;}.elementor-26136 .elementor-element.elementor-element-a8e2aeb{margin-top:0px;margin-bottom:0px;padding:5% 15% 5% 15%;}.elementor-26136 .elementor-element.elementor-element-54ced91 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-26136 .elementor-element.elementor-element-7bc1339 > .elementor-widget-container{padding:5% 0% 1% 0%;}.elementor-26136 .elementor-element.elementor-element-7bc1339{text-align:center;}.elementor-26136 .elementor-element.elementor-element-7bc1339 .elementor-heading-title{font-size:2.5em;font-weight:900;line-height:1.3em;letter-spacing:-0.02em;color:var( --e-global-color-0c99566 );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-26136 .elementor-element.elementor-element-1638125{text-align:center;font-size:1em;font-weight:400;color:var( --e-global-color-a52c461 );}.elementor-26136 .elementor-element.elementor-element-455f94f .elementor-button{background-color:#D9EDEB00;font-family:"Pretendard", Sans-serif;font-size:18px;font-weight:700;fill:var( --e-global-color-a52c461 );color:var( --e-global-color-a52c461 );border-style:none;}.elementor-26136 .elementor-element.elementor-element-455f94f .elementor-button:hover, .elementor-26136 .elementor-element.elementor-element-455f94f .elementor-button:focus{background-color:var( --e-global-color-224b7e4 );color:var( --e-global-color-a52c461 );}.elementor-26136 .elementor-element.elementor-element-455f94f > .elementor-widget-container{margin:0% 0% 0% 0%;}.elementor-26136 .elementor-element.elementor-element-455f94f .elementor-button:hover svg, .elementor-26136 .elementor-element.elementor-element-455f94f .elementor-button:focus svg{fill:var( --e-global-color-a52c461 );}.elementor-26136 .elementor-element.elementor-element-8e1cf86{padding:5% 0% 10% 0%;}.elementor-widget-tabs .elementor-tab-title, .elementor-widget-tabs .elementor-tab-title a{color:var( --e-global-color-primary );}.elementor-widget-tabs .elementor-tab-title.elementor-active,
					 .elementor-widget-tabs .elementor-tab-title.elementor-active a{color:var( --e-global-color-accent );}.elementor-widget-tabs .elementor-tab-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-tabs .elementor-tab-content{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tab-title, .elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tab-title:before, .elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tab-title:after, .elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tab-content, .elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tabs-content-wrapper{border-width:1px;}.elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tab-title, .elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tab-title a{color:var( --e-global-color-primary );}.elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tab-title.elementor-active,
					 .elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tab-title.elementor-active a{color:var( --e-global-color-224b7e4 );}.elementor-26136 .elementor-element.elementor-element-43068e4 .elementor-tab-title{font-size:1.2em;font-weight:900;}.elementor-26136 .elementor-element.elementor-element-3f82c95{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:8% 15% 5% 15%;}.elementor-26136 .elementor-element.elementor-element-3f82c95 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-bc-flex-widget .elementor-26136 .elementor-element.elementor-element-11fcb69.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-26136 .elementor-element.elementor-element-11fcb69.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-26136 .elementor-element.elementor-element-11fcb69 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-26136 .elementor-element.elementor-element-dbc799f > .elementor-widget-container{padding:0% 0% 1% 0%;}.elementor-26136 .elementor-element.elementor-element-dbc799f{text-align:center;}.elementor-26136 .elementor-element.elementor-element-dbc799f .elementor-heading-title{font-size:3em;font-weight:900;line-height:1.3em;letter-spacing:-0.02em;color:var( --e-global-color-0c99566 );}.elementor-widget-toggle .elementor-toggle-title, .elementor-widget-toggle .elementor-toggle-icon{color:var( --e-global-color-primary );}.elementor-widget-toggle .elementor-toggle-icon svg{fill:var( --e-global-color-primary );}.elementor-widget-toggle .elementor-tab-title.elementor-active a, .elementor-widget-toggle .elementor-tab-title.elementor-active .elementor-toggle-icon{color:var( --e-global-color-accent );}.elementor-widget-toggle .elementor-toggle-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-toggle .elementor-tab-content{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-26136 .elementor-element.elementor-element-e87d2ec > .elementor-widget-container{margin:-2% -2% -2% -2%;padding:0% 0% 0% 0%;}.elementor-26136 .elementor-element.elementor-element-e87d2ec .elementor-tab-content{border-block-end-color:var( --e-global-color-68031d7 );color:#000009;font-size:0.95em;letter-spacing:-0.03em;}.elementor-26136 .elementor-element.elementor-element-e87d2ec .elementor-tab-title{border-color:var( --e-global-color-68031d7 );}.elementor-26136 .elementor-element.elementor-element-e87d2ec .elementor-toggle-item:not(:last-child){margin-block-end:1em;}.elementor-26136 .elementor-element.elementor-element-e87d2ec .elementor-tab-title.elementor-active a, .elementor-26136 .elementor-element.elementor-element-e87d2ec .elementor-tab-title.elementor-active .elementor-toggle-icon{color:#A596FC;}.elementor-26136 .elementor-element.elementor-element-e87d2ec .elementor-toggle-title{font-size:1.1em;font-weight:600;text-decoration:none;}@media(max-width:1024px){.elementor-26136 .elementor-element.elementor-element-a8e2aeb{padding:50px 50px 50px 50px;}.elementor-26136 .elementor-element.elementor-element-455f94f .elementor-button{font-size:14px;padding:12px 30px 12px 30px;}.elementor-26136 .elementor-element.elementor-element-3f82c95{padding:80px 30px 100px 30px;}}@media(max-width:767px){.elementor-26136 .elementor-element.elementor-element-a8e2aeb{padding:50px 30px 100px 30px;}.elementor-26136 .elementor-element.elementor-element-7bc1339 > .elementor-widget-container{margin:0% 0% 0% 0%;padding:15% 0% 0% 0%;}.elementor-26136 .elementor-element.elementor-element-7bc1339{text-align:center;}.elementor-26136 .elementor-element.elementor-element-7bc1339 .elementor-heading-title{font-size:2em;line-height:1.5em;letter-spacing:-0.03em;}.elementor-26136 .elementor-element.elementor-element-1638125{font-size:16px;}.elementor-26136 .elementor-element.elementor-element-455f94f > .elementor-widget-container{margin:20px 0px 0px 0px;}.elementor-26136 .elementor-element.elementor-element-455f94f .elementor-button{font-size:14px;padding:15px 50px 15px 50px;}.elementor-26136 .elementor-element.elementor-element-3f82c95{margin-top:0px;margin-bottom:0px;padding:80px 20px 80px 20px;}.elementor-26136 .elementor-element.elementor-element-dbc799f > .elementor-widget-container{margin:0% 0% 0% 0%;padding:15% 0% 0% 0%;}.elementor-26136 .elementor-element.elementor-element-dbc799f{text-align:center;}.elementor-26136 .elementor-element.elementor-element-dbc799f .elementor-heading-title{font-size:2em;line-height:1.5em;letter-spacing:-0.03em;}.elementor-26136 .elementor-element.elementor-element-e87d2ec .elementor-toggle-title{line-height:1.5em;}}/* Start custom CSS for section, class: .elementor-element-8e1cf86 *//* =========================================================
   HubSpot Pricing / Compare — KS Design System Version
   전제: 페이지 또는 부모 섹션에 ks-hs 클래스 필요
   ========================================================= */

/* 전체 래퍼 */
.sks,
.sks * {
  box-sizing: border-box;
}

/* ===== HUB TABS ===== */
#sks-hubtabs {
  padding: 1.5em 1em;
  position: sticky;
  top: 80px;
  z-index: 40;
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(0.75em);
  -webkit-backdrop-filter: blur(0.75em);
  border-bottom: 1px solid var(--ks-gray-200);
}

#sks-hubtabs .sks-hubtabs__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}

#sks-hubtabs .sks-hubtabs__group {
  display: inline-flex;
  gap: 0.35em;
  padding: 0.35em;
  background: var(--ks-white);
  border: 1px solid var(--ks-gray-200);
  border-radius: 3em;
  overflow-x: auto;
}

#sks-hubtabs .sks-hubtabs__btn {
  border: 0;
  background: transparent;
  padding: 0.75em 1.35em;
  border-radius: 3em;
  font-size: 0.9em;
  font-weight: 700;
  color: var(--ks-text-muted);
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.25s ease;
}

#sks-hubtabs .sks-hubtabs__btn:hover {
  color: var(--ks-primary);
  background: rgba(255, 106, 59, 0.08);
}

#sks-hubtabs .sks-hubtabs__btn.is-active {
  background: var(--ks-primary);
  color: var(--ks-white);
  box-shadow: 0 0.5em 1.5em rgba(255, 106, 59, 0.25);
}

/* 탭 콘텐츠 */
.sks [data-sks-hub-pane] {
  display: none;
}

.sks [data-sks-hub-pane].is-active {
  display: block;
}

/* ===== PRICE TIERS ===== */
.sks-tiers {
  padding: 5em 1em;
}

.sks-tiers .sks-tiers__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.sks-tiers .sks-tiers__head {
  text-align: center;
  margin-bottom: 3em;
}

.sks-tiers .sks-tiers__title {
  margin: 0 0 0.5em;
}

.sks-tiers .sks-tiers__sub {
  max-width: 42em;
  margin: 0 auto;
  color: var(--ks-text-muted);
  line-height: 1.7;
}

.sks-tiers .sks-tiers__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25em;
}

/* 가격 카드: ks-card-light 기반 */
.sks-tiers .sks-tier {
  background: var(--ks-white) !important;
  border: 1px solid var(--ks-gray-200) !important;
  border-radius: 1.25em !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: all 0.3s ease !important;
}

.sks-tiers .sks-tier:hover {
  transform: translateY(-0.25em);
  border-color: transparent !important;
  box-shadow: 0 1em 2.5em rgba(169, 116, 224, 0.15);
}

/* 추천 카드 */
.sks-tiers .sks-tier--rec {
  border-color: rgba(255, 106, 59, 0.45) !important;
  box-shadow: 0 1em 2.5em rgba(255, 106, 59, 0.12);
}

.sks-tiers .sks-tier__badge {
  background: linear-gradient(135deg, var(--ks-primary), var(--ks-secondary));
  color: var(--ks-white);
  font-size: 0.75em;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
  padding: 0.6em 0;
}

.sks-tiers .sks-tier__body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding: 2em;
}

.sks-tiers .sks-tier__name {
  margin: 0 0 0.35em;
  font-size: 1.2em;
  font-weight: 800;
  color: var(--ks-text);
}

.sks-tiers .sks-tier__tag {
  min-height: 3em;
  margin: 0 0 1.5em;
  font-size: 0.9em;
  color: var(--ks-text-muted);
  line-height: 1.6;
}

.sks-tiers .sks-tier__priceRow {
  margin-bottom: 0.75em;
  display: flex;
  align-items: baseline;
  gap: 0.35em;
  flex-wrap: wrap;
}

.sks-tiers .sks-tier__price {
  font-size: 2.4em;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ks-primary), var(--ks-secondary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.sks-tiers .sks-tier__period {
  font-size: 0.85em;
  color: var(--ks-text-muted);
}

.sks-tiers .sks-tier__includes {
  font-size: 0.85em;
  font-weight: 600;
  color: var(--ks-text);
  background: var(--ks-lightgray);
  border: 1px solid var(--ks-gray-200);
  text-align: center;
  padding: 0.7em;
  border-radius: 0.65em;
  margin-bottom: 1.5em;
}

/* 버튼: ks-btn 느낌으로 통일 */
.sks-tiers .sks-tier__btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 0.5em;
  padding: 0.95em 1.5em !important;
  border-radius: 3em !important;
  font-size: 0.95em !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
  margin-bottom: 1.75em;
}

.sks-tiers .sks-tier__btn--solid {
  background: var(--ks-primary) !important;
  color: var(--ks-white) !important;
  border: 0 !important;
  box-shadow: 0 0.5em 1.5em rgba(255, 106, 59, 0.25);
}

.sks-tiers .sks-tier__btn--solid:hover {
  background: var(--ks-hover) !important;
  transform: translateY(-0.125em);
  box-shadow: 0 0.75em 2em rgba(165, 150, 252, 0.35);
}

.sks-tiers .sks-tier__btn--outline {
  background: transparent !important;
  color: var(--ks-primary) !important;
  border: 1px solid rgba(255, 106, 59, 0.45) !important;
}

.sks-tiers .sks-tier__btn--outline:hover {
  color: var(--ks-hover) !important;
  border-color: var(--ks-hover) !important;
  background: rgba(165, 150, 252, 0.08) !important;
}

.sks-tiers .sks-tier__featLbl {
  margin: 0 0 1em;
  font-size: 0.9em;
  font-weight: 800;
  color: var(--ks-text);
}

.sks-tiers .sks-tier__features {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75em;
  flex-grow: 1;
}

.sks-tiers .sks-tier__features li {
  display: flex;
  align-items: flex-start;
  font-size: 0.9em;
  color: var(--ks-text-muted);
  line-height: 1.55;
}

.sks-tiers .sks-tier__check {
  flex-shrink: 0;
  width: 1.25em;
  height: 1.25em;
  margin-right: 0.65em;
  border-radius: 50%;
  background: rgba(255, 106, 59, 0.12);
  position: relative;
}

.sks-tiers .sks-tier__check::before {
  content: '✓';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ks-primary);
  font-size: 0.75em;
  font-weight: 900;
}

/* ===== COMPARE TABLE ===== */
.sks-compare {
  padding: 5em 1em;
}

.sks-compare .sks-compare__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.sks-compare .sks-compare__head {
  text-align: center;
  margin-bottom: 3em;
}

.sks-compare .sks-compare__title {
  margin: 0 0 0.5em;
}

.sks-compare .sks-compare__sub {
  color: var(--ks-text-muted);
  margin: 0 auto;
  max-width: 42em;
  line-height: 1.7;
}

.sks-compare .sks-compare__card {
  background: var(--ks-white);
  border: 1px solid var(--ks-gray-200);
  border-radius: 1.25em;
  box-shadow: 0 1em 2.5em rgba(169, 116, 224, 0.10);
  overflow: hidden;
}

.sks-compare .sks-compare__scroll {
  overflow-x: auto;
}

.sks-compare .sks-compare__table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  min-width: 800px;
}

.sks-compare .sks-compare__th {
  background: var(--ks-white);
  padding: 1.1em;
  border-bottom: 1px solid var(--ks-gray-200);
  width: 25%;
  min-width: 200px;
  position: sticky;
  top: 0;
  z-index: 10;
}

.sks-compare .sks-compare__th--c {
  text-align: center;
}

.sks-compare .sks-compare__th--mid {
  background: var(--ks-lightgray);
  border-left: 1px solid var(--ks-gray-200);
  border-right: 1px solid var(--ks-gray-200);
}

.sks-compare .sks-compare__plan {
  display: inline-block;
  font-size: 1em;
  font-weight: 800;
  color: var(--ks-text);
}

.sks-compare .sks-compare__plan--rec {
  color: var(--ks-primary);
}

/* 카테고리 행 */
.sks-compare .sks-compare__cat {
  background: var(--ks-lightgray);
  cursor: pointer;
  transition: background 0.2s ease;
}

.sks-compare .sks-compare__cat:hover {
  background: var(--ks-cream);
}

.sks-compare .sks-compare__cat > td {
  padding: 1em;
  border-bottom: 1px solid var(--ks-gray-200);
  font-weight: 800;
  color: var(--ks-text);
  font-size: 0.95em;
}

.sks-compare .sks-compare__chev {
  display: inline-block;
  width: 1.25em;
  height: 1.25em;
  vertical-align: middle;
  margin-right: 0.5em;
  position: relative;
  transform: rotate(180deg);
  transition: transform 0.2s;
}

.sks-compare .sks-compare__chev::before {
  content: '⌄';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ks-text-muted);
  font-weight: 800;
}

.sks-compare .sks-compare__cat.is-collapsed .sks-compare__chev {
  transform: rotate(0deg);
}

/* 내용 행 */
.sks-compare .sks-compare__row td {
  padding: 1em;
  border-bottom: 1px solid var(--ks-gray-100);
  font-size: 0.9em;
  color: var(--ks-text-muted);
  background: var(--ks-white);
  transition: background 0.15s;
}

.sks-compare .sks-compare__row:hover td {
  background: rgba(238, 242, 249, 0.5);
}

.sks-compare .sks-compare__c {
  text-align: center;
}

.sks-compare .sks-compare__c--mid {
  background: rgba(238, 242, 249, 0.45) !important;
  border-left: 1px solid var(--ks-gray-200);
  border-right: 1px solid var(--ks-gray-200);
}

.sks-compare .sks-compare__row:hover .sks-compare__c--mid {
  background: rgba(238, 242, 249, 0.75) !important;
}

/* Yes / No icons */
.sks-compare .sks-compare__yes,
.sks-compare .sks-compare__no {
  display: inline-flex;
  width: 1.25em;
  height: 1.25em;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  border-radius: 50%;
  font-weight: 900;
}

.sks-compare .sks-compare__yes::before {
  content: '✓';
  color: var(--ks-primary);
}

.sks-compare .sks-compare__no::before {
  content: '—';
  color: var(--ks-gray-300);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
  .sks-tiers .sks-tiers__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  #sks-hubtabs {
    top: 0;
    padding: 1em 0.75em;
  }

  #sks-hubtabs .sks-hubtabs__inner {
    justify-content: flex-start;
  }

  #sks-hubtabs .sks-hubtabs__group {
    width: 100%;
    justify-content: flex-start;
  }

  #sks-hubtabs .sks-hubtabs__btn {
    padding: 0.7em 1.1em;
    font-size: 0.85em;
  }

  .sks-tiers,
  .sks-compare {
    padding: 3.5em 0;
  }

  .sks-tiers .sks-tiers__grid {
    grid-template-columns: 1fr;
    gap: 1em;
  }

  .sks-tiers .sks-tier__body {
    padding: 1.5em;
  }

  .sks-tiers .sks-tier__price {
    font-size: 2em;
  }

  .sks-compare .sks-compare__table {
    min-width: 720px;
  }
}/* End custom CSS */
/* Start custom CSS *//* ════════════════════════════════════════════════════════════════
   경성솔루션 · HubSpot Sub-Pages (Marketing / Sales / Service / Content)
   Custom CSS Skeleton — v1.0

   사용법:
   ① Elementor Editor → 페이지 설정(우측 톱니 아이콘)
      → 고급 → Custom CSS → 이 파일 전체 복사 · 붙여넣기
   ② 혹은 Elementor → 사이트 설정 → Custom CSS (전체 페이지 공통)

   클래스 적용법:
   · 각 Section / Inner Section / Column / Widget 을 클릭
   · "고급(Advanced)" 탭 → "CSS Classes" 필드
   · 아래 주석에 표시된 클래스 이름을 입력 (여러 개는 공백으로 구분)

   컬러 팔레트 (HubSpot 메인 규칙):
   · Primary   : #FF6A3B  (키 포인트 — CTA · 숫자 강조)
   · Secondary : #A974E0  (보조 포인트 — 퍼플 브랜드 컬러)
   · Hover     : #A596FC  (롤오버 강조)
   ════════════════════════════════════════════════════════════════ */


/* ───── 1. 팔레트 변수 (페이지 최상위 래퍼에 ks-hs 클래스 지정) ───── */
.ks-hs {
  --ks-primary: #FF6A3B;
  --ks-primary-soft: #FF8C5F;
  --ks-secondary: #A974E0;
  --ks-secondary-soft: #C29EEB;
  --ks-hover: #A596FC;

  --ks-bg-deep: #07061A;
  --ks-bg-dark: #0D0B24;
  --ks-bg-mid: #15102E;
  --ks-bg-light: #1E1740;

  --ks-white: #FFFFFF;
  --ks-lightgray: #EEF2F9;
  --ks-cream: #FAF8F4;
  --ks-gray-100: #F3F2F7;
  --ks-gray-200: #E5E3EE;
  --ks-gray-300: #CED1DB;
  --ks-gray-400: #9BA3B5;
  --ks-text: #1F1B3A;
  --ks-text-muted: #6B6486;
}


/* ───── 2. 우주(Universe) 다크 래퍼 ─────
   · 다크 섹션을 감쌀 부모 Section 에 class="ks-hs ks-universe"
   · 별빛 그라디언트 + 은은한 퍼플·오렌지 라이트 자동 생성 */
.ks-hs.ks-universe {
  background: var(--ks-bg-deep);
  color: var(--ks-white);
  position: relative;
  overflow: hidden;
}
.ks-hs.ks-universe::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 15% 10%, rgba(255, 106, 59, 0.12) 0%, transparent 40%),
    radial-gradient(ellipse at 85% 30%, rgba(169, 116, 224, 0.15) 0%, transparent 45%),
    radial-gradient(ellipse at 50% 70%, rgba(165, 150, 252, 0.10) 0%, transparent 50%),
    radial-gradient(ellipse at 20% 90%, rgba(169, 116, 224, 0.10) 0%, transparent 40%);
  pointer-events: none;
  z-index: 0;
}
.ks-hs.ks-universe::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(1px 1px at 10% 20%, #fff 50%, transparent 100%),
    radial-gradient(1px 1px at 25% 70%, #fff 50%, transparent 100%),
    radial-gradient(1.5px 1.5px at 40% 15%, #fff 50%, transparent 100%),
    radial-gradient(1px 1px at 55% 55%, #fff 50%, transparent 100%),
    radial-gradient(1.5px 1.5px at 70% 30%, #fff 50%, transparent 100%),
    radial-gradient(1px 1px at 85% 75%, #fff 50%, transparent 100%),
    radial-gradient(1px 1px at 15% 85%, #fff 50%, transparent 100%),
    radial-gradient(1.5px 1.5px at 62% 88%, #fff 50%, transparent 100%),
    radial-gradient(1px 1px at 90% 12%, #fff 50%, transparent 100%),
    radial-gradient(1px 1px at 35% 45%, #fff 50%, transparent 100%);
  opacity: 0.6;
  pointer-events: none;
  z-index: 0;
}
.ks-hs.ks-universe > .elementor-container,
.ks-hs.ks-universe > .e-con-inner { position: relative; z-index: 1; }


/* ───── 3. 섹션 배경 ─────
   · class="ks-section-light" → 크림색 배경
   · class="ks-section-dark"  → 투명 (우주 부모 위) */
.ks-section-light { background: var(--ks-cream) !important; }
.ks-section-lightgray { background: var(--ks-lightgray) !important; }
.ks-section-dark  { background: transparent !important; }


/* ───── 4. 그라데이션 배경 섹션 ─────
   · Section CSS Classes: ks-hs ks-gradation */
.ks-hs.ks-gradation {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 0% 0%, rgba(255, 106, 59, 0.10) 0%, transparent 32%),
    radial-gradient(ellipse at 100% 100%, rgba(165, 150, 252, 0.22) 0%, transparent 38%),
    linear-gradient(135deg, #FAF8F4 0%, #EEF2F9 52%, #F3F2FF 100%) !important;
}

/* 내부 콘텐츠가 배경 위로 올라오게 */
.ks-hs.ks-gradation > .elementor-container,
.ks-hs.ks-gradation > .e-con-inner {
  position: relative;
  z-index: 1;
}


/* ───── 5. 버튼 (Elementor Button 위젯 호환) ─────
   · 사용: Button 위젯의 CSS class 에 "ks-btn" (또는 "ks-btn-outline")
   · Elementor 기본 스타일을 덮기 위해 !important 적용 */
.ks-hs a.ks-btn,
.ks-hs .ks-btn > a,
.ks-hs .ks-btn .elementor-button {
  display: inline-flex !important;
  align-items: center;
  gap: 0.5em;
  padding: 1em 2.25em !important;
  background: var(--ks-primary) !important;
  background-color: var(--ks-primary) !important;
  color: var(--ks-white) !important;
  fill: var(--ks-white) !important;
  font-size: 1em !important;
  font-weight: 700 !important;
  border: 0 !important;
  border-radius: 3em !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 0.5em 1.5em rgba(255, 106, 59, 0.3);
  text-decoration: none !important;
}
.ks-hs a.ks-btn:hover,
.ks-hs .ks-btn:hover > a,
.ks-hs .ks-btn:hover .elementor-button {
  background: var(--ks-hover) !important;
  background-color: var(--ks-hover) !important;
  transform: translateY(-0.125em);
  box-shadow: 0 0.75em 2em rgba(165, 150, 252, 0.45);
}
.ks-hs a.ks-btn-outline,
.ks-hs .ks-btn-outline > a,
.ks-hs .ks-btn-outline .elementor-button {
  display: inline-flex !important;
  align-items: center;
  gap: 0.5em;
  padding: 1em 2.25em !important;
  background: transparent !important;
  background-color: transparent !important;
  color: var(--ks-white) !important;
  fill: var(--ks-white) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  border-radius: 3em !important;
  transition: all 0.3s ease !important;
}
.ks-hs a.ks-btn-outline:hover,
.ks-hs .ks-btn-outline:hover > a,
.ks-hs .ks-btn-outline:hover .elementor-button {
  border-color: var(--ks-hover) !important;
  color: var(--ks-hover) !important;
  fill: var(--ks-hover) !important;
  background: rgba(165, 150, 252, 0.08) !important;
  background-color: rgba(165, 150, 252, 0.08) !important;
}


/* ───── 6. 카드 박스 (우주 섹션 내부 반투명 유리 카드) ─────
   · 가장 많이 쓰이는 컴포넌트
   · 사용: Section / Inner Section / Column 의 CSS class 에 "ks-card"
   · 포인트 바 추가: "ks-card ks-accent-orange" 혹은 ks-accent-purple / ks-accent-hover */
.ks-card {
  background: rgba(30, 23, 64, 0.55) !important;
  border: 1px solid rgba(91, 80, 159, 0.55) !important;
  border-radius: 1.25em !important;
  padding: 1.5em !important;
  margin: 0.5em !important;
  transition: all 0.3s ease !important;
  backdrop-filter: blur(0.5em);
  -webkit-backdrop-filter: blur(0.5em);
}
.ks-card:hover {
  border-color: var(--ks-hover) !important;
  transform: translateY(-0.25em);
  box-shadow: 0 1em 2.5em rgba(165, 150, 252, 0.15);
}
.ks-card.ks-accent-orange,
.ks-card.ks-accent-purple,
.ks-card.ks-accent-hover { position: relative; overflow: hidden; }
.ks-card.ks-accent-orange::before,
.ks-card.ks-accent-purple::before,
.ks-card.ks-accent-hover::before {
  content: ''; position: absolute;
  top: 0; left: 0; right: 0; height: 3px;
  opacity: 0; transition: opacity 0.3s;
}
.ks-card.ks-accent-orange::before { background: var(--ks-primary); }
.ks-card.ks-accent-purple::before { background: var(--ks-secondary); }
.ks-card.ks-accent-hover::before  { background: var(--ks-hover); }
.ks-card:hover::before { opacity: 1; }


/* ───── 7. 밝은 카드 (크림 배경 섹션 전용) ─────
   · 사용: CSS class 에 "ks-card-light" */
.ks-card-light {
  background: var(--ks-white) !important;
  border: 1px solid var(--ks-gray-200) !important;
  border-radius: 1.25em !important;
  padding: 2em !important;
  margin: 0.5em !important;
  transition: all 0.3s ease !important;
}
.ks-card-light:hover {
  transform: translateY(-0.25em);
  border-color: transparent !important;
  box-shadow: 0 1em 2.5em rgba(169, 116, 224, 0.15);
}


/* ───── 8. 숫자 하이라이트 (그라디언트 큰 숫자) ─────
   · 사용: Heading 위젯의 CSS class 에 "ks-bignum" */
.ks-bignum {
  background: linear-gradient(135deg, var(--ks-primary), var(--ks-secondary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent !important; /* fallback */
}



/* ───── 9. FAQ (Q/A 박스) ─────
   · 각 문답 Inner Section 에 class="ks-faq-item"
   · Q 측 Heading 위젯에 class="ks-faq-q"
   · A 측 Text 위젯에 class="ks-faq-a" */
.ks-faq-item {
  padding: 1.75em 2em !important;
  background: rgba(30, 23, 64, 0.55) !important;
  border: 1px solid rgba(169, 116, 224, 0.22) !important;
  border-radius: 1em !important;
  transition: all 0.3s ease !important;
  backdrop-filter: blur(0.5em);
  -webkit-backdrop-filter: blur(0.5em);
}
.ks-faq-item:hover { border-color: var(--ks-hover) !important; }
.ks-faq-q,
.ks-faq-item .ks-faq-q {
  font-size: 1.05em !important;
  color: var(--ks-white) !important;
  text-decoration: none !important;
  margin-bottom: 0.85em !important;
  padding-left: 1.5em !important;
  position: relative;
}
.ks-faq-q::before,
.ks-faq-item .ks-faq-q::before {
  content: 'Q.';
  position: absolute;
  left: 0; top: 0;
  color: var(--ks-primary);
}
.ks-faq-a,
.ks-faq-item .ks-faq-a {
  font-size: 0.95em !important;
  color: rgba(255,255,255,0.85) !important;
  text-decoration: none !important;
  padding-left: 1.65em !important;
  position: relative;
}
.ks-faq-a::before,
.ks-faq-item .ks-faq-a::before {
  content: 'A.';
  position: absolute;
  left: 0; top: 0;
  color: var(--ks-hover);
  font-weight: 800;
}
.ks-faq-item a {
  text-decoration: none !important;
  border-bottom: none !important;
}


/* ───── 10. CTA 마지막 섹션 (중앙 정렬 + 오렌지 글로우) ─────
   · Section CSS class 에 "ks-hs ks-universe ks-cta" */
.ks-cta {
  padding: 7% 5% !important;
  text-align: center !important;
  position: relative;
}
.ks-cta::before {
  content: '';
  position: absolute;
  top: -10%;
  left: 50%;
  transform: translateX(-50%);
  width: 40em;
  height: 40em;
  background: radial-gradient(circle, rgba(255, 106, 59, 0.2) 0%, transparent 60%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}
.ks-cta > .elementor-container,
.ks-cta > .e-con-inner,
.ks-cta > * { position: relative; z-index: 1; }


/* ───── 11. 반응형 ───── */
@media (max-width: 768px) {
  .ks-hs {
    padding-left: 2em !important;
    padding-right: 2em !important;
  }
  .ks-hero {
    padding: 4em 2em 3em !important;
  }

  .ks-card,
  .ks-card-light,
  .ks-faq-item {
    padding: 1.5em !important;
  }
}/* End custom CSS */