/* NOVA 랜딩 홈 — 라이트 테마(네이비 + 보라). fusionmarkets 레이아웃/느낌 참고, 문구·비주얼·브랜드는 NOVA 독자 제작. */
.landing{
  --nv:#0d1350;        /* 네이비(제목) */
  --nv-soft:#3a3f6b;   /* 네이비 보조 */
  --pp:#742cce;        /* 보라(CTA) */
  --pp-light:#985eff;  /* 밝은 보라 */
  --pp-tint:#f1ecff;   /* 보라 배경 틴트 */
  --ink:#7d7987;       /* 본문 회색 */
  --paper:#ffffff;
  --paper2:#f7f8fc;
  --card:#f4f4f9;
  --hair:#e6e8f2;
  position:relative; overflow:hidden; min-height:100vh;
  background:var(--paper); color:var(--nv);
}
/* 홈에서는 상단바를 흰색으로 (참고 사이트처럼) */
body.home-active .topbar{background:rgba(255,255,255,.92); border-bottom-color:var(--hair,#e6e8f2)}
body.home-active .topbar .brand,
body.home-active .topbar .nav>button{color:#0d1350}
body.home-active .topbar .nav>button:hover{color:#742cce}
body.home-active .brand-mark{background:linear-gradient(135deg,#742cce,#985eff);color:#fff}
body.home-active .topbar .icon-btn{color:#3a3f6b}

/* 히어로 */
.landing .hero-shape{position:absolute;top:-160px;right:-120px;width:720px;height:720px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#c9b6ff 0%,#a789ff 42%,#dfe6ff 100%);opacity:.55;filter:blur(2px);z-index:0}
.landing .hero-shape.two{top:280px;right:38%;width:280px;height:280px;background:radial-gradient(circle at 40% 40%,#eadfff,#cdbcff);opacity:.35;filter:blur(30px)}
.landing .hero{position:relative;z-index:2;width:min(1180px,92vw);margin:0 auto;min-height:calc(100vh - var(--header));
  display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:3vw;padding:40px 0}
.landing .hero-copy .eyebrow{display:inline-flex;align-items:center;gap:8px;background:var(--pp-tint);color:var(--pp);
  font-weight:700;font-size:12px;padding:7px 14px;border-radius:30px;letter-spacing:.3px}
.landing .hero-copy h1{font-size:clamp(34px,4.6vw,62px);line-height:1.06;letter-spacing:-1.5px;margin:22px 0 0;font-weight:800;color:var(--nv)}
.landing .hero-copy h1 em{font-style:normal;background:linear-gradient(120deg,#742cce,#985eff);-webkit-background-clip:text;background-clip:text;color:transparent}
.landing .hero-copy p{color:var(--ink);font-size:clamp(15px,1.5vw,18px);line-height:1.7;max-width:30em;margin:22px 0 0}
.landing .hero-copy p b{color:var(--nv);font-weight:700}
.landing .hero-actions{display:flex;align-items:center;gap:16px;margin-top:36px;flex-wrap:wrap}
.landing .btn-primary{background:linear-gradient(135deg,#742cce,#5b1fb0);color:#fff;border:0;border-radius:9px;
  padding:16px 30px;font-weight:800;font-size:14px;letter-spacing:.5px;cursor:pointer;
  box-shadow:0 14px 30px rgba(116,44,206,.32);transition:transform .15s,box-shadow .15s}
.landing .btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 38px rgba(116,44,206,.42)}
.landing .btn-ghost{background:#fff;color:var(--pp);border:1.5px solid #d9cff2;border-radius:9px;padding:15px 28px;
  font-weight:800;font-size:14px;letter-spacing:.5px;cursor:pointer;transition:border-color .15s,color .15s}
.landing .btn-ghost:hover{border-color:var(--pp);color:var(--nv)}
.landing .hero-or{color:#9aa0be;font-weight:700;font-size:12px}
.landing .hero-trust{display:flex;align-items:center;gap:8px;margin-top:26px;color:var(--ink);font-size:12px}
.landing .hero-trust .stars{color:#12c98a;letter-spacing:2px;font-size:14px}

/* 히어로 비주얼 — CSS로 만든 원본 기기 목업 */
.landing .hero-visual{position:relative;height:440px;display:grid;place-items:center}
.landing .device{width:min(430px,90%);background:#0d1350;border-radius:16px;padding:14px;
  box-shadow:0 34px 80px rgba(13,19,80,.28);position:relative;z-index:2}
.landing .device .screen{background:linear-gradient(180deg,#141c5e,#0d1350);border-radius:9px;padding:16px}
.landing .device .scr-top{display:flex;justify-content:space-between;align-items:center;color:#c9ccff;font-size:11px;font-weight:700}
.landing .device .scr-price{color:#fff;font-size:22px;font-weight:800;margin:12px 0 2px}
.landing .device .scr-up{color:#5ef2b3;font-size:12px;font-weight:700}
.landing .device svg{display:block;width:100%;height:120px;margin-top:8px}
.landing .device .scr-bars{display:flex;gap:5px;align-items:flex-end;height:44px;margin-top:12px}
.landing .device .scr-bars i{flex:1;background:linear-gradient(180deg,#985eff,#5b1fb0);border-radius:3px;opacity:.85}
.landing .float-pill{position:absolute;z-index:3;background:#fff;border-radius:12px;box-shadow:0 16px 34px rgba(13,19,80,.16);
  padding:12px 15px;font-size:12px;color:var(--nv);border:1px solid var(--hair)}
.landing .float-pill small{display:block;color:var(--ink);font-size:10px;margin-bottom:3px}
.landing .float-pill b{font-size:15px;font-weight:800}
.landing .float-pill.a{top:34px;left:-8px}
.landing .float-pill.b{bottom:40px;right:-6px}
.landing .float-pill .up{color:#12c98a}

/* 섹션 공통 */
.landing .l-section{position:relative;z-index:2;width:min(1180px,92vw);margin:0 auto;padding:70px 0}
.landing .l-head{text-align:center;max-width:720px;margin:0 auto 46px}
.landing .l-head h2{font-size:clamp(28px,3.4vw,46px);font-weight:800;color:var(--nv);letter-spacing:-1px;margin:0}
.landing .l-head .rule{width:56px;height:4px;background:linear-gradient(90deg,#742cce,#985eff);border-radius:3px;margin:18px auto}
.landing .l-head p{color:var(--ink);font-size:clamp(15px,1.5vw,17px);line-height:1.7;margin:0}

/* 기능 카드 2x2 */
.landing .feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.landing .feature{background:var(--card);border:1px solid var(--hair);border-radius:16px;padding:30px 30px 32px;transition:transform .15s,box-shadow .15s}
.landing .feature:hover{transform:translateY(-3px);box-shadow:0 20px 44px rgba(13,19,80,.09)}
.landing .feature .ic{width:52px;height:52px;border-radius:13px;background:var(--pp-tint);display:grid;place-items:center;
  color:var(--pp);font-size:22px;margin-bottom:18px}
.landing .feature h3{font-size:20px;font-weight:800;color:var(--nv);margin:0 0 10px}
.landing .feature p{color:var(--ink);font-size:14px;line-height:1.7;margin:0}

/* 시세 스트립 */
.landing .l-markets{background:var(--paper2);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.landing .ticker-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;width:min(1180px,92vw);margin:0 auto;padding:26px 0}
.landing .ticker-cell{background:#fff;border:1px solid var(--hair);border-radius:12px;padding:16px 18px;display:flex;align-items:center;gap:12px}
.landing .ticker-cell .sym{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font-weight:800;color:#fff;font-size:14px;flex-shrink:0}
.landing .ticker-cell .nm{font-weight:800;color:var(--nv);font-size:13px}
.landing .ticker-cell .pr{font-weight:800;color:var(--nv);font-size:15px;margin-top:2px}
.landing .ticker-cell .ch{font-size:11px;font-weight:700;margin-left:auto}
.landing .ch.up{color:#12b886}.landing .ch.down{color:#f0435b}

/* 통계 밴드 */
.landing .l-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;width:min(1180px,92vw);margin:0 auto;padding:56px 0;text-align:center}
.landing .l-stats>div strong{display:block;font-size:clamp(26px,3vw,40px);font-weight:800;color:var(--nv)}
.landing .l-stats>div span{color:var(--ink);font-size:13px}

/* 마지막 CTA */
.landing .l-cta{position:relative;z-index:2;width:min(1180px,92vw);margin:0 auto 80px;
  background:linear-gradient(135deg,#0d1350,#2a1a6e 60%,#5b1fb0);border-radius:22px;padding:64px 40px;text-align:center;
  box-shadow:0 30px 70px rgba(13,19,80,.3);overflow:hidden}
.landing .l-cta::after{content:"";position:absolute;top:-60px;right:-40px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,#985eff88,transparent 70%)}
.landing .l-cta h2{color:#fff;font-size:clamp(26px,3.2vw,40px);font-weight:800;margin:0;position:relative;z-index:1}
.landing .l-cta p{color:#c9ccff;font-size:15px;margin:16px 0 30px;position:relative;z-index:1}
.landing .l-cta .btn-primary{background:#fff;color:var(--pp);box-shadow:0 14px 30px rgba(0,0,0,.2);position:relative;z-index:1}
.landing .l-cta .btn-primary:hover{color:var(--nv)}

/* 푸터 고지 */
.landing .l-note{text-align:center;color:#a7abc4;font-size:11px;line-height:1.7;padding:0 0 60px;width:min(1180px,92vw);margin:0 auto}

/* 다크 테마에서도 홈은 라이트 유지(랜딩 자체가 밝은 브랜드 화면) */
body.light .landing{background:var(--paper)}

@media(max-width:900px){
  .landing .hero{grid-template-columns:1fr;gap:10px;padding:24px 0 10px;text-align:center;min-height:auto}
  .landing .hero-copy p{margin-left:auto;margin-right:auto}
  .landing .hero-actions{justify-content:center}
  .landing .hero-trust{justify-content:center}
  .landing .hero-visual{height:340px;order:2;margin-top:20px}
  .landing .hero-shape{width:420px;height:420px;top:-120px;right:-140px}
  .landing .feature-grid{grid-template-columns:1fr;gap:16px}
  .landing .ticker-strip{grid-template-columns:1fr 1fr}
  .landing .l-stats{grid-template-columns:1fr 1fr;gap:28px 20px}
  .landing .l-section{padding:48px 0}
  .landing .l-cta{padding:46px 24px}
}
@media(max-width:520px){
  .landing .ticker-strip{grid-template-columns:1fr}
  .landing .float-pill.a{left:2px}.landing .float-pill.b{right:2px}
}