.elementor-21081 .elementor-element.elementor-element-f9ec649 > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-21081 .elementor-element.elementor-element-71ead72{--spacer-size:50px;}.elementor-21081 .elementor-element.elementor-element-be71e3d > .elementor-element-populated{padding:0px 0px 0px 0px;}/* Start custom CSS for section, class: .elementor-element-2875424 */:root {
  --bg0: #0B0F2A;      /* 딥 네이비 */
  --bg1: #0E1538;

  --accent: #4DA8FF;   /* 블루 */
  --accent2: #4FE0C4;  /* 민트 */

  --text: rgba(255,255,255,0.95);
  --muted: rgba(255,255,255,0.7);
}

 .wt-hero{
 
    --bg0:#070A12;
    --bg1:#0B1022;
    --text:rgba(255,255,255,.92);
    --muted:rgba(255,255,255,.72);
    --stroke:rgba(255,255,255,.12);

    /* 포인트 색상 */


    position:relative;
    overflow:hidden;
    
    isolation:isolate;

    min-height:clamp(520px,62vh,760px);
    display:grid;
    align-items:center;
    padding:clamp(26px,3.8vw,52px);

    background:
      radial-gradient(1200px 700px at 20% 10%, rgba(77,168,255,.25), transparent 55%),
  radial-gradient(900px 600px at 90% 30%, rgba(79,224,196,.20), transparent 55%),
  linear-gradient(180deg, #0B0F2A, #0E1538);
    box-shadow:0 28px 80px rgba(0,0,0,.35);
  }

  .wt-bg{position:absolute;inset:0;z-index:-1;}
  .wt-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.9;}

  .wt-grid{
    position:absolute;inset:-2px;
    background:
      linear-gradient(to right, rgba(255,255,255,.06) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size:54px 54px;
    opacity:.28;
    pointer-events:none;

    /* 마스크 대체: 자연스럽게 중앙만 강조 */
    -webkit-mask-image: radial-gradient(600px 360px at 55% 45%, rgba(0,0,0,.9), transparent 72%);
    mask-image: radial-gradient(600px 360px at 55% 45%, rgba(0,0,0,.9), transparent 72%);
  }

  .wt-blob{
    position:absolute;
    width:520px;height:520px;
    filter:blur(22px);
    opacity:.32;
    border-radius:999px;
    background:
      radial-gradient(circle at 30% 30%, rgba(124,92,255,.95), rgba(124,92,255,0) 60%),
      radial-gradient(circle at 65% 70%, rgba(34,211,238,.85), rgba(34,211,238,0) 60%);
    pointer-events:none;
    transform:translate3d(0,0,0) scale(1);
    will-change:transform;
  }
  .wt-blob.b1{left:-180px;top:-180px;}
  .wt-blob.b2{right:-240px;top:20px;width:640px;height:640px;opacity:.26;}
  .wt-blob.b3{left:20%;bottom:-320px;width:760px;height:760px;opacity:.18;}

  .wt-wrap{text-align: center; max-width:1200px;margin-inline:auto;}

  .wt-badge{
    display:inline-flex;align-items:center;gap:10px;
    padding:10px 14px;
    border:1px solid var(--stroke);
    background:rgba(255,255,255,.06);
    color:var(--muted);
    border-radius:999px;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    font-size:14px;
    letter-spacing:-.2px;
  }
  .wt-badge:before{
    content:"";
    width:8px;height:8px;border-radius:99px;
    background:linear-gradient(90deg,var(--accent),var(--accent2));
    box-shadow:0 0 18px rgba(124,92,255,.5);
  }

  .wt-title{
    margin:35px 0;
    color:var(--text);
    font-weight:800;
    line-height:1.08;
    letter-spacing:-1.2px;
    font-size:clamp(30px,4.2vw,56px);
    text-shadow:0 10px 30px rgba(0,0,0,.35);
  }
  .wt-accent{
    background:linear-gradient(90deg,var(--accent),var(--accent2));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
    filter:drop-shadow(0 10px 22px rgba(124,92,255,.25));
  }

  .wt-subtitle{
    margin:0 0 18px;
    color:var(--muted);
    font-size:clamp(14px,1.5vw,18px);
    line-height:1.65;
    max-width:920px;
  }

  .wt-cta{justify-content: center; display:flex;gap:12px;flex-wrap:wrap;margin-top:40px;}

  .wt-btn{
    display:inline-flex;align-items:center;justify-content:center;
    padding: 10px 30px;
  border-radius: 999px; /* pill 형태 */
    text-decoration:none;
    font-weight:700;
    letter-spacing:-.2px;
    border:1px solid var(--stroke);
    background:rgba(255,255,255,.06);
    transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
    will-change:transform;
  }
  .wt-btn.primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;


  font-weight: 700;
  font-size: 16px;
  letter-spacing: -0.2px;

  color: #ffffff;
  border: none;

  background-image: linear-gradient(to right, #2CB499, #1F6EAD);


  transition: all 0.25s ease;
}
  .wt-btn.ghost{color:var(--text);}
  .wt-btn:hover{transform:translateY(-2px);box-shadow:0 22px 60px rgba(0,0,0,.35);}
  .wt-btn:active{transform:translateY(0px);}

  /* ✅ @media 없이 반응형: auto-fit + minmax로 자동 줄바꿈 */
/* ===== Metrics: 이미지 같은 바(bar) 스타일 ===== */
.wt-metrics.wt-metrics--bar{
  margin-top: 26px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;                 /* ✅ 칸 사이 간격 제거 */
  align-items: center;

  padding: 18px 10px;
 
  background: transparent; /* ✅ 바 형태로만 */
}

/* 기존 카드형 박스(배경/라운드/테두리) 제거 + 중앙정렬 */
.wt-metrics.wt-metrics--bar .wt-metric{
  position: relative;
  padding: 0px;
  text-align: center;

  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* 세로 구분선 */
.wt-metrics.wt-metrics--bar .wt-metric:not(:last-child)::after{
  content: "";
  position: absolute;
  top: 10px;
  bottom: 10px;
  right: 0;
  width: 1px;
  background: rgba(255,255,255,.16);
}

/* 위 숫자/문구 */
.wt-metrics.wt-metrics--bar .wt-num{
  font-weight: 600;
  letter-spacing: -0.6px;
  line-height: 1.05;
  font-size: clamp(22px, 2.6vw, 34px);
  color: rgba(255,255,255,.95);
  
}

/* 아래 설명 */
.wt-metrics.wt-metrics--bar .wt-label{
  margin-top: 6px;
  font-size: 13px;
  letter-spacing: -0.2px;
  color: rgba(255,255,255,.68);
  
}

/* (선택) 강조색 살짝 주고 싶으면: 숫자만 로고톤으로 */
.wt-metrics.wt-metrics--bar .wt-num span{
  background: linear-gradient(90deg, var(--accent), var(--accent2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
  .wt-num{
    font-weight:850;
    color:var(--text);
    font-size:clamp(18px,2vw,24px);
    letter-spacing:-.6px;
  }
  .wt-label{margin-top:4px;color:var(--muted);font-size:13px;}

  /* JS에서 붙여줄 클래스 (모션 OFF) */
  .wt-no-motion .wt-btn{transition:none;}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-c639ade */.roadmap-section {
    padding: 6rem 0;
    background-color: #;
    color: #0f172a;
    box-sizing: border-box;
  }

  .roadmap-section * {
    box-sizing: border-box;
  }

  .roadmap-container {
    max-width: 80rem;
    margin: 0 auto;
    padding: 0 1rem;
  }

  .roadmap-header {
    text-align: center;
    margin-bottom: 4rem;
  }

  .roadmap-title {
    font-size: clamp(1.9rem, 3vw, 2.4rem);
    line-height: 1.3;
    font-weight: 700;
    margin-bottom: 1rem;
    color: #0b112a;
    word-break: keep-all;
  }

  .roadmap-subtitle {
    font-size: 1.125rem;
    color: #475569;
    margin: 0;
    word-break: keep-all;
    line-height: 1.7;
  }

  .roadmap-content-wrapper {
    position: relative;
  }

  .roadmap-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    position: relative;
    z-index: 10;
    justify-content: center;
    align-items: stretch;
  }
  
  .roadmap-connecting-line {
    position: absolute;
    top: 50%;
    left: 8%;
    width: 84%;
    height: 4px;
    background-color: #e2e8f0;
    transform: translateY(-50%);
    border-radius: 9999px;
    z-index: 1;
    pointer-events: none;
  }

  .roadmap-card {
    border-radius: 1rem;
    padding: 2rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    position: relative;
    flex: 1 1 320px;
    max-width: 390px;
    min-width: 260px;
  }

  .roadmap-card:hover {
    transform: translateY(-5px);
  }

  .step-1 {
    background-color: #ffffff;
    border: 2px solid #2cb499;
    box-shadow: 0 20px 25px -5px rgba(226, 232, 240, 0.5), 0 8px 10px -6px rgba(226, 232, 240, 0.5);
  }

  .step-2 {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 10px 15px -3px rgba(226, 232, 240, 0.4), 0 4px 6px -4px rgba(226, 232, 240, 0.4);
  }

  .step-3 {
    background-color: #0b112a;
    border: 1px solid #1e293b;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
  }

  .roadmap-badge {
    position: absolute;
    top: -1rem;
    right: 1rem;
    background-color: #2cb499;
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    white-space: nowrap;
  }

  .roadmap-icon-wrapper {
    width: 4rem;
    height: 4rem;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
  }

  .icon-teal { background-color: #f0fdfa; color: #2cb499; }
  .icon-blue { background-color: #eff6ff; color: #1f6ead; }
  .icon-dark { background-color: #1e293b; color: #fbbf24; }

  .roadmap-card-title {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    color: #0b112a;
    word-break: keep-all;
  }

  .roadmap-card-title.text-white {
    color: #ffffff;
  }

  .roadmap-card-desc {
    color: #64748b;
    font-weight: 500;
    margin: 0 0 1.5rem 0;
    line-height: 1.6;
    word-break: keep-all;
  }

  .roadmap-card-desc.text-slate-400 {
    color: #94a3b8;
  }

  .roadmap-requirement-box {
    border-radius: 0.75rem;
    padding: 1rem;
    margin-bottom: 1.5rem;
  }

  .box-light {
    background-color: #f8fafc;
    border: 1px solid #f1f5f9;
  }

  .box-dark {
    background-color: rgba(30, 41, 59, 0.5);
    border: 1px solid #334155;
  }

  .requirement-flex {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.6;
  }

  .requirement-flex strong {
    display: block;
    color: #334155;
    word-break: keep-all;
  }

  .requirement-flex strong.text-slate-200 {
    color: #e2e8f0;
  }

  .requirement-subtext {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
    margin-top: 0.25rem;
    word-break: keep-all;
    line-height: 1.5;
  }

  .requirement-subtext.text-slate-400 {
    color: #94a3b8;
  }

  .check-icon {
    flex-shrink: 0;
    margin-top: 0.125rem;
  }

  .text-teal { color: #2cb499; }
  .text-blue { color: #1f6ead; }
  .text-amber { color: #fbbf24; }

  .roadmap-list {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 0.875rem;
  }

  .roadmap-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    line-height: 1.6;
    word-break: keep-all;
  }

  .roadmap-list li:last-child {
    margin-bottom: 0;
  }

  .list-dark {
    color: #475569;
  }

  .list-light {
    color: #cbd5e1;
  }

  .list-dark .chevron-icon {
    color: #94a3b8;
    flex-shrink: 0;
    margin-top: 0.2rem;
  }

  .list-light .chevron-icon {
    color: #64748b;
    flex-shrink: 0;
    margin-top: 0.2rem;
  }/* End custom CSS */