/*
.mil-logo .bnx{
  font-size: 6px;
  height: 50px;
  font-weight: 500;
  line-height: 1; 
}


.mil-menu-frame .mil-logo {
  font-size: 34px;
  height: 60px;
}


@media (max-width: 992px) {
  .mil-logo,
  .mil-menu-frame .mil-logo .bnx{
    font-size: 30px;
    height: 50px;
  } 
} 

@font-face {
  font-family: "Hellix";
  src: url("/fonts/Hellix-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Hellix";
  src: url("/fonts/Hellix-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
.mil-frame-top .mil-logo,
.mil-menu-frame .mil-frame-top .mil-logo {
  font-family: "Hellix", "Hellix Regular", -apple-system, BlinkMacSystemFont,
               "Segoe UI", Roboto, "Noto Sans", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700; 
  letter-spacing: 0.2px;
}
*/

/* header row = flex */
.mil-frame-top{
  display:flex;
  align-items:center;
  justify-content:space-between;  /* logo left, menu button right */
  padding-left: calc(16px + env(safe-area-inset-left));   /* 모바일 노치 대응 */
  padding-right: calc(16px + env(safe-area-inset-right));
}

/* left align the logo, kill any theme centering */
.mil-frame-top .mil-logo{
  margin-right:auto !important;
  margin-left:0 !important;
  display:block;

}

/* logo size */
.mil-frame-top .mil-logo .bnx{ height:66px; width:auto; display:block; }
@media (max-width:992px){
  .mil-frame-top .mil-logo .bnx{ height:50px;}
  .bnx{ margin-top:  25px;;}
}
/* full-bleed left: break out of centered container safely */
.mil-frame-top .mil-logo{
  margin-right:auto !important;
  /* (화면반 - 컨테이너반)만큼 왼쪽으로 보정 + 좌측 여백 16px */
  transform: translateX(calc((50vw - 50%) * -1 + 16px));
}

/* 모바일은 여백 조금 줄이기 */
@media (max-width:992px){
  .mil-frame-top .mil-logo{
    transform: translateX(calc((50vw - 11%) * -1 + 12px));
  }
}

/* spacing (원래 margin-top:50px, margin-left:-10px 주고 싶었던 부분) */
.mil-menu-brand { margin-top: 65px; }
.mil-menu-brand-link { display:block; height:66px; }

/* 로고 사이즈: 컨테이너에 맞춰 66px, 가로는 비율유지 */
.mil-menu-logo{
  display:block;
  height:40px !important;

  margin-left: -45px;        /* 원하는 좌측 보정 */
}

/* 모바일에서 높이를 줄이고 싶다면 */
@media (max-width: 992px){
    .mil-menu-brand { margin-top: 0px !important; }
  .mil-menu-brand-link{ height: 35px !important; }   /* 예: 48px로 축소 */
}

@media (max-width: 992px){
  .mil-banner h1{ white-space: normal !important; word-break: keep-all; }
  .mil-banner h1 br{ display: inline !important; }
}



@media screen and (max-width: 1200px) {
    .mil-frame .mil-frame-top {
   
        background-color: #0d0d0d;
       border: none;
    }
}

/* --- Clean footer --- */
.bn-footer-pad{ padding: 72px 48px; }
.bn-cols .bn-col{ margin-bottom: 40px; }

.bn-h{
  margin: 0 0 16px;
  font-weight: 600;
  color: #fff;
  position: relative;
  padding-top: 12px;
}
.bn-h::before{
  content:"";
  position: absolute;
  left: 0; top: 0;
  width: 100%;
  height: 1px;
  background: rgba(255,255,255,.32);
}

.bn-list{ list-style: none; margin: 0; padding: 0; }
.bn-list li{ margin: 10px 0; }
.bn-list a{ color: rgba(255,255,255,.92); text-decoration: none; }
.bn-list a:hover{ opacity: .9; }

.bn-note{ margin: 6px 0 6px; color: rgba(255,255,255,.6); }
.bn-link{ color: #7db6ff; text-decoration: none; }
.bn-link:hover{ text-decoration: underline; }

.bn-btn{ margin-top: 12px; }

/* bottom line */
.bn-bottom{
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.12);
}
.bn-legal{ display: inline-flex; gap: 16px; list-style: none; margin: 0; padding: 0; }
.bn-legal a{ color: rgba(255,255,255,.7); text-decoration: none; }
.bn-legal a:hover{ opacity:.9; }
.bn-copy{ margin: 0; color: rgba(255,255,255,.7); }

/* responsive */
@media (max-width: 992px){
  .bn-footer-pad{ padding: 56px 36px; }
  .bn-h{ padding-top: 10px; }
  /* ② 푸터 상단 라인 제거 */
.bn-bottom{
  border-top: 0 !important;
}
}

/* --- BNX: image overrides for the tokenomics hero --- */

/* 1) stop color inversion or blending inside dark sections */
.bn-no-invert {
  filter: none !important;           /* cancel any filter: invert(...) */
  -webkit-filter: none !important;
  mix-blend-mode: normal !important; /* cancel blend tricks */
}

/* 2) prevent crop, show the whole image on all screens */
.bn-no-crop {
  transform: none !important;        /* cancel .mil-scale transforms */
}

/* 3) wrapper: remove hidden overflow and fixed aspect tricks, keep black letterbox */
.bn-img-wrap {
  overflow: visible !important;      /* allow full image to show */
  padding: 0 !important;             /* kill aspect-box padding if any */
  background: #000;                  /* keep the natural black background */
  border-radius: 12px;               /* optional, match your style */
}

/* 4) the <img> itself: scale to box without cropping */
.bn-img {
  display: block;
  width: 100%;
  height: auto;                      /* default: do not crop */
}

/* 5) mobile fine-tune: if your framework forces absolute positioning */
@media (max-width: 768px) {
  .bn-img {
    width: 100%;
    height: auto;                    /* ensure full image is visible */
    object-fit: contain;             /* safety: fit inside wrapper if height is constrained */
  }
}









/* drawing only */
.draw-hero{ --stroke:#E0E6EB; --stroke-width:1.6; }

.draw-inner{
  display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(24px,6vw,64px); align-items:center;
}
@media (max-width:960px){ .draw-inner{ grid-template-columns:1fr; } }

.draw-wrap{
  position:relative;
  aspect-ratio:586/351;
  width: min(720px, 94%);       /* ← 조금 더 크게 */
  margin-inline:auto;
}

.draw-svg{
  width:100%; height:100%; display:block;
  color:#fff;
  stroke: var(--stroke);
  stroke-width: var(--stroke-width);
  vector-effect: non-scaling-stroke;
  transform-origin: 60% 40%;
  will-change: transform;

  /* ✅ 시작 포즈: 훨씬 눕힘 + 더 멀리 보이게 */
  transform: perspective(800px) translateZ(-120px) rotateX(58deg) rotateY(-18deg) scale(.84);

  filter: drop-shadow(0 0 20px rgba(255,255,255,.06));
}
.draw-svg path{ fill:none; stroke:currentColor; }




/* ===== Fixed ribbon for exchange page ===== */
.bn-listing-notice{
  position: fixed;      /* ← sticky 대신 fixed */
  left: 0; right: 0;
  top: var(--frame-height, 64px);  /* 헤더 높이만큼 아래 */
  z-index: 1100;
  background: linear-gradient(90deg,#2a2a2a 0%,#1f1f1f 100%);
  border-bottom: 1px solid rgba(255,255,255,.10);
  color: #fff;
}
.bn-listing-inner{
  max-width: 1200px; margin: 0 auto;
  padding: 10px 16px; display: flex; gap: 12px; align-items: center;
}
.bn-listing-text{ font-size:14px; line-height:1.5; color:rgba(255,255,255,.92); }
.bn-listing-text em{ font-style:normal; color:#fff1a8; }
.bn-listing-text u{ text-underline-offset: 2px; }

.bn-listing-close{
  margin-left: auto; appearance:none; border:0; cursor:pointer;
  width:28px; height:28px; border-radius:6px;
  background: rgba(255,255,255,.08); color:#fff;
}
.bn-listing-close:hover{ background: rgba(255,255,255,.16); }

/* the spacer just reserves the ribbon height in the normal flow */
.bn-listing-spacer{ height: var(--notice-h, 0px); }

@media (max-width: 992px){
  .bn-listing-inner{ padding:10px 12px; }
  .bn-listing-text{ font-size:13px; }
}



/* 버튼 라벨이 항상 최상단, 화살표는 뒤 */
.mil-button.mil-arrow-place { 
  position: relative; 
  display: inline-flex; 
  align-items: center; 
  gap: 10px; 
  padding-right: 42px;            /* 화살표 자리 */
}
.mil-button.mil-arrow-place span { position: relative; z-index: 3; }
.mil-button.mil-arrow-place .mil-arrow {
  position: absolute; 
  right: 16px; top: 50%; 
  transform: translateY(-50%);
  z-index: 1; 
  pointer-events: none;           /* 클릭 방해 금지 */
}

/* draw 섹션: 글자 > 도형 */
.draw-copy { position: relative; z-index: 2; }
.draw-wrap { position: relative; z-index: 1; }
.mil-button.mil-arrow-place { position: relative; display: inline-flex; align-items: center; gap: 10px; padding-right: 42px; }
.mil-button.mil-arrow-place span { position: relative; z-index: 3; }
.mil-button.mil-arrow-place .mil-arrow { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); z-index: 1; pointer-events: none; }

.mil-button.mil-arrow-place span {
  
  
    margin-right: 30px;
}