/*
.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: 892px) {
  .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;

}



/* 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: 892px){
    .mil-menu-brand { margin-top: 0px !important; }
  .mil-menu-brand-link{ height: 35px !important; }   /* 예: 48px로 축소 */
}

@media (max-width: 892px){
  .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: #010202;
       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: 892px){
  .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; }








.mil-frame-top .mil-logo img, .mil-menu-frame .mil-frame-top .mil-logo img, .mil-frame-top .mil-logo picture, .mil-menu-frame .mil-frame-top .mil-logo picture {

    height: 35px;
}

@media (max-width: 892px){
  .mil-frame-top .mil-logo img,
  .mil-frame-top .mil-logo picture {

    height: 26px;
  }
}


/* draw 섹션: 글자 > 도형 */
.draw-copy { position: relative; z-index: 2; }
.draw-wrap { position: relative; z-index: 1; }

.mil-button.mil-arrow-place span {
  
  
    margin-right: 30px;
}
/* Desktop (default) */
#stack {
  font-weight: 700;
}

/* Mobile */
@media (max-width: 892px) {
  #stack {
    font-weight: 700;
    font-size: 60px;
    line-height: 1.1; /* optional: tighten if needed */
  }
}

    .stack { font-weight: 700; }
    @media (max-width: 892px) { .stack { font-weight: 700; font-size: 60px; } }




/* ===== Blacknomix: keep original colors & size for article hero ===== */
/* ===== Blacknomix: dark image section (isolate filters/blends) ===== */
#dark-img{
  background: #000;                  /* 섹션 배경을 순수 블랙 */
  padding: 60px 0;                   /* 위아래 영역 (원하면 조절) */
}

/* 테마가 상위에 invert/blend를 걸어둔 경우 대비: 섹션 내부는 따로 격리 */
#dark-img .bn-figure{
  isolation: isolate;                /* 상위 mix-blend 컨텍스트 차단 */
  max-width: 780px;                  /* 이미지 최대 폭 (원하면 680px 등) */
  margin: 0 auto 30px;               /* 가운데 정렬 + 하단 여백 */
  padding: 0 16px;                   /* 좌우 여백 */
  filter: none !important;
  -webkit-filter: none !important;
  mix-blend-mode: normal !important;
}

/* 실제 이미지: 어떤 필터/블렌드도 금지 + 반응형 */
#dark-img img.bn-original{
  display: block;
  width: 100% !important;
  height: auto !important;
  object-fit: contain;
  filter: none !important;
  -webkit-filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
  background: transparent !important;
}

/* 페이지가 .mi-invert-fix(전체 invert) 테마를 쓸 때: 이미지에만 '역반전' */
.mi-invert-fix #dark-img img.bn-original{
  filter: invert(1) !important;      /* 부모 invert(1)와 상쇄돼 최종 원본색 */
}

/* 어두운 섹션 전용 규칙이 강하게 물려 있을 수 있어, 특이성 한 번 더 보강 */
.mil-dark-bg #dark-img img.bn-original{
  filter: none !important;
  mix-blend-mode: normal !important;
}

 /* Stop text shrinking in WebKit-based in-app browsers */
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

  /* Detect Twitter in-app browser via UA and apply a class (added by JS below) */
  html.inapp-twitter body { font-size: 16px; line-height: 1.6; }
  /* Optional: ensure headings don’t collapse */
  html.inapp-twitter h1 { font-size: clamp(24px, 5.5vw, 36px); }
  html.inapp-twitter h2 { font-size: clamp(20px, 4.5vw, 30px); }
  html.inapp-twitter h3 { font-size: clamp(18px, 4vw, 24px); }

  /* If you use 100vh sections, switch to dynamic var to avoid iOS toolbar issues */
  :root { --vh: 1vh; }
  .use-dvh { min-height: calc(var(--vh) * 100); }

/* === BNX: Ultra-minimal language dropdown (underline only) === */
.bn-lang-dd{ position: relative; list-style: none; margin-top: 12px; }

/* Toggle looks like a plain text link */
.bn-lang-toggle{
  appearance: none; background: none; border: 0; padding: 0;
  color: #fff; font-size: 14px; line-height: 1.2; cursor: pointer;
  text-decoration: underline; text-underline-offset: 2px;
}

/* Hidden by default on all viewports */
.bn-lang-menu{
  position: absolute; left: 0; top: calc(100% + 6px);
  display: none; /* closed by default */
  min-width: 220px; /* keeps a tidy width on desktop */
}

/* Open state */
.bn-lang-dd.is-open .bn-lang-menu{ display: block; }

/* Items: plain underlined links */
.bn-lang-item{
  display: block; padding: 6px 0;
  color: rgba(255,255,255,.95); text-decoration: underline;
  text-underline-offset: 2px;
}
.bn-lang-item:hover{ opacity: .9; }

/* Mobile: keep dropdown closed by default too; show inline list when open */
@media (max-width: 892px){
  .bn-lang-menu{ position: static; min-width: 0; }
  .bn-lang-item{ padding: 8px 0; }
}

/* Mobile-only centered X close button (no bg, no border) */
.bn-lang-close{
  display: none;
  appearance: none;
  background: none;
  border: 0;
  padding: 0;
  width: 44px;          /* comfortable tap target */
  height: 44px;
  line-height: 1;
  color: #fff;          /* inherits menu text color */
  cursor: pointer;
  margin: 10px auto 0;  /* centered horizontally */
}

.bn-lang-close .bn-x{
  display: block;
  opacity: .95;
  transition: opacity .15s ease, transform .15s ease;
}
.bn-lang-close:hover .bn-x{ opacity: 1; transform: scale(1.05); }
.bn-lang-close:focus-visible{ outline: 2px solid rgba(255,255,255,.5); outline-offset: 2px; }

/* show only on mobile */
@media (max-width: 892px){
  .bn-lang-close{ display: block; }
  .bn-lang-close .bn-x {
    display: block;
    opacity: .95;
    transition: opacity .15s 
ease, transform .15s 
ease;
    background: #626262d4;
    border-radius: 30px;
    font-size: 39px;
    width: 38px;
    height: 38px;
}
}

/* === BNX: language toggle typography match (smaller than menu) === */

/* 데스크톱 기준: 메뉴보다 작게 */
.mil-main-menu :is(.bn-lang-toggle, .bn-lang-item){
  font-family: inherit !important;      /* 메뉴와 동일 폰트 계승 */
  font-weight: 500 !important;          /* 메뉴보다 한 단계 가볍게(필요하면 400으로) */
  font-size: 20px !important;           /* 메뉴 텍스트보다 작게 */
  line-height: 1.45 !important;
  letter-spacing: .2px !important;
  color: rgba(255,255,255,.92) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* 모바일: 한 단계 더 작게 */
@media (max-width: 892px){
  .mil-main-menu :is(.bn-lang-toggle, .bn-lang-item){
    font-size: 20px !important;
    font-weight: 500 !important;
  }
}

/* 밑줄 두께/오프셋만 살짝 정돈 */
.mil-main-menu .bn-lang-toggle{
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
  text-decoration-thickness: .06em !important;
}

/* 드롭다운 화살표(▾)나 caret이 있다면 작게 */
.mil-main-menu .bn-caret,
.mil-main-menu .bn-lang-toggle > span[aria-hidden="true"]{
  font-size: 12px !important;
  opacity: .8 !important;
  vertical-align: baseline;
}

html[lang="ko"] body {
  font-family: "Plus Jakarta Sans", "Pretendard Variable", Pretendard, -apple-system,
               BlinkMacSystemFont, system-ui, "Apple SD Gothic Neo", "Noto Sans KR",
               "Segoe UI", "Malgun Gothic", "Helvetica Neue", Arial,
               "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji";
}
