/* =========================================================================
   NAV2.CSS — public header. Fixed height at every width: scrolling never changes
   its size (that was what made the previous version flicker). Logo is always left.
   ========================================================================= */
.pn { position: sticky; top: 0; z-index: 1000; height: 74px; background: #0A1911; border-bottom: 1px solid rgba(198,160,82,.28); }
.pn-in { height: 100%; max-width: 1200px; margin: 0 auto; padding: 0 28px; display: flex; align-items: center; gap: 28px; }
.pn-logo { display: inline-flex; align-items: center; flex: none; text-decoration: none; }
.pn-logo img { display: block; height: 40px; width: auto; max-width: 200px; object-fit: contain; }
.pn-logo-text { font-size: 1.3rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #E3C57E; }

.pn-links { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.pn-links a { position: relative; padding: 10px 14px; color: rgba(255,255,255,.78); text-decoration: none; font-size: .93rem; font-weight: 500; border-radius: 8px; transition: color .2s, background .2s; }
.pn-links a:hover { color: #fff; background: rgba(255,255,255,.06); }
.pn-links a.active { color: #fff; }
.pn-links a.active::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 2px; height: 2px; border-radius: 2px; background: #93DF13; }

.pn-tools { display: flex; align-items: center; gap: 12px; }
.pn-lang { background: none; border: 1px solid rgba(255,255,255,.18); color: #fff; border-radius: 8px; width: 38px; height: 38px; display: inline-grid; place-items: center; cursor: pointer; font: inherit; font-size: .85rem; padding: 0; }
.pn-lang:hover { border-color: #93DF13; color: #93DF13; }
.pn-login { color: #fff; text-decoration: none; font-weight: 600; font-size: .92rem; padding: 8px 6px; }
.pn-login:hover { color: #93DF13; }
.pn-cta { display: inline-flex; align-items: center; height: 42px; padding: 0 20px; border-radius: 10px; background: linear-gradient(180deg, #A9EE34, #93DF13); color: #0C2117; font-weight: 700; font-size: .88rem; text-decoration: none; box-shadow: 0 8px 20px -12px rgba(147,223,19,.7); transition: transform .15s, box-shadow .15s; }
.pn-cta:hover { transform: translateY(-1px); box-shadow: 0 12px 24px -12px rgba(147,223,19,.9); }
.pn-userbtn, .pn-burger { display: none; }
.pn-progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: linear-gradient(90deg, #93DF13, #E3C57E); transform: scaleX(0); transform-origin: left; pointer-events: none; will-change: transform; }

/* ---- full-page menu (mobile) ---- */
.curtain, .curtain-shade { display: none; }
@media (max-width: 900px) {
  .pn { height: 62px; }
  .pn-in { padding: 0 16px; gap: 10px; }
  .pn-logo img { height: 34px; max-width: 160px; }
  .pn-links, .pn-login, .pn-cta { display: none; }
  .pn-tools { margin-left: auto; gap: 8px; }
  .pn-userbtn { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; border: 1px solid rgba(255,255,255,.18); color: #fff; text-decoration: none; font-size: .9rem; }
  .pn-burger { display: inline-flex; flex-direction: column; justify-content: center; gap: 4px; width: 38px; height: 38px; padding: 0 10px; border-radius: 10px; border: 1px solid rgba(198,160,82,.5); background: transparent; cursor: pointer; }
  .pn-burger i { display: block; height: 2px; background: #E3C57E; border-radius: 2px; } .pn-burger i:nth-child(2) { width: 70%; align-self: flex-end; }

  .curtain-shade { display: block; position: fixed; inset: 0; background: rgba(0,0,0,.55); opacity: 0; pointer-events: none; transition: opacity .25s; z-index: 1190; }
  .curtain-shade.is-open { opacity: 1; pointer-events: auto; }
  .curtain { display: flex; flex-direction: column; position: fixed; inset: 0; z-index: 1200; background: linear-gradient(180deg, #0E2218, #07120C); opacity: 0; visibility: hidden; transform: scale(1.02); transition: opacity .25s ease, transform .25s ease, visibility .25s; }
  .curtain.is-open { opacity: 1; visibility: visible; transform: none; }
  .cv-top { flex: none; height: 62px; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(198,160,82,.28); }
  .cv-close { width: 38px; height: 38px; border-radius: 10px; border: 1px solid rgba(198,160,82,.5); background: transparent; color: #E3C57E; font-size: 1rem; cursor: pointer; }
  .cv-body { flex: 1; overflow-y: auto; padding: 18px 16px 8px; }
  .cv-label { margin: 0 0 10px; font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #C6A052; }
  .cv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 22px; }
  .cv-grid a { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,.09); background: rgba(255,255,255,.03); color: rgba(255,255,255,.9); text-decoration: none; font-size: .9rem; font-weight: 500; opacity: 0; transform: translateY(8px); }
  .curtain.is-open .cv-grid a { animation: cvIn .35s calc(.08s + var(--i) * .04s) ease forwards; }
  .cv-grid a i { width: 18px; text-align: center; color: #93DF13; font-size: .85rem; }
  .cv-grid a.active { border-color: #93DF13; background: rgba(147,223,19,.1); color: #fff; }
  .curtain-prices { margin: 0 0 20px; }
  .cv-cta { display: flex; align-items: center; justify-content: center; gap: 10px; height: 46px; border-radius: 10px; background: linear-gradient(180deg, #A9EE34, #93DF13); color: #0C2117; font-weight: 700; font-size: .92rem; text-decoration: none; }
  .cv-chart-wrap { margin-top: 22px; }
  .cv-chart { height: 420px; border-radius: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.09); background: rgba(255,255,255,.03); }
  .cv-chart .tradingview-widget-container, .cv-chart .tradingview-widget-container__widget { height: 100%; width: 100%; }
  .cv-foot { flex: none; padding: 14px 16px calc(14px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid rgba(198,160,82,.25); display: flex; align-items: center; justify-content: space-between; gap: 14px; background: rgba(0,0,0,.18); }
  .cv-contact { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
  .cv-contact a { display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,.75); text-decoration: none; font-size: .8rem; min-width: 0; }
  .cv-contact a i { width: 16px; text-align: center; color: #C6A052; flex: none; }
  .cv-contact a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cv-lang { flex: none; display: inline-flex; flex-direction: row; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 10px; border: 1px solid rgba(147,223,19,.45); background: rgba(147,223,19,.08); color: #fff; font: 600 .84rem var(--font-body); cursor: pointer; white-space: nowrap; }
  .cv-lang i { color: #93DF13; font-size: .9rem; }
  .cv-lang:active { background: rgba(147,223,19,.18); }
}
@keyframes cvIn { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .curtain, .cv-grid a { transition: none; animation: none !important; opacity: 1; transform: none; } }
