html { scroll-behavior: smooth; }
:root{
  --glass-bg: 18, 24, 38;
  --glass-alpha: .45;
  --glass-border: rgba(255,255,255,.12);
  --ring: 0 0 0 3px rgba(34,211,238,.25);
}
.link{ color: rgb(103 232 249); transition: color .15s ease; }
.link:hover{ color: rgb(165 243 252); }
.nav-link{ color: rgba(226,232,240,.9); transition: color .15s ease; }
.nav-link:hover{ color: white; }
.nav-cta{ font-size:.9rem; padding:.5rem .75rem; }
.glass{
  background: rgba(var(--glass-bg), var(--glass-alpha));
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 30px rgba(0,0,0,.35);
}
.glass-card{
  background: rgba(var(--glass-bg), var(--glass-alpha));
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 1rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 20px 60px rgba(0,0,0,.35);
  padding: 1rem;
}
.glass-btn{
  background: rgba(var(--glass-bg), var(--glass-alpha));
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: .75rem;
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.glass-btn:hover{ transform: translateY(-1px); box-shadow: 0 8px 30px rgba(56,189,248,.18); }
.input{
  width: 100%; border-radius: .75rem; padding: .5rem .75rem;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1);
  outline: none; color: rgb(226,232,240);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  transition: box-shadow .15s ease, border-color .15s ease;
}
.input:focus{ box-shadow: var(--ring); border-color: rgba(34,211,238,.35); }
.badge{
  display:inline-flex; align-items:center; gap:.25rem;
  font-size:.75rem; padding:.25rem .5rem; border-radius:9999px;
  background: rgba(34,211,238,.15); color: rgb(103 232 249);
  border: 1px solid rgba(103,232,249,.2);
}
.tag{ font-size:.75rem; padding:.25rem .5rem; border-radius:9999px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); }
.card-hover{ transition: transform .2s ease, box-shadow .2s ease; }
.card-hover:hover{ transform: translateY(-2px); box-shadow: 0 20px 60px rgba(0,0,0,.35); }
.shine{ position: relative; overflow: hidden; }
.shine::after{
  content:""; position:absolute; inset:-150% -150% auto auto;
  width:120%; height:120%;
  background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,.15) 35%, transparent 50%);
  transform: rotate(15deg);
  animation: shine 4s linear infinite;
}
@keyframes shine{
  0%{ transform: translateX(-120%) rotate(15deg); }
  100%{ transform: translateX(120%) rotate(15deg); }
}
.hero-gradient{
  background: radial-gradient(1200px 500px at 10% -10%, rgba(34,211,238,.15), transparent 60%),
              radial-gradient(900px 500px at 110% 10%, rgba(217,70,239,.12), transparent 60%);
}
.prose{ color: rgb(226,232,240); }
.prose h1{ font-size: 2rem; font-weight: 800; margin: 1.5rem 0 1rem; }
@media(min-width:768px){ .prose h1{ font-size: 2.5rem; } }
.prose h2{ font-size: 1.5rem; font-weight: 700; margin: 1.25rem 0 .75rem; }
.prose p{ color: rgb(203,213,225); line-height: 1.7; margin: .75rem 0; }
.prose img, .prose video{ border-radius: 1rem; margin: 1rem 0; max-width: 100%; height: auto; }
.prose a{ color: rgb(103 232 249); }
.prose code{ background: rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius: .375rem; padding: .1rem .3rem; }
.prose ul{ list-style: disc; padding-left: 1.25rem; margin: .75rem 0; }
.prose ol{ list-style: decimal; padding-left: 1.25rem; margin: .75rem 0; }
.modal{ position: fixed; inset: 0; display: grid; place-items: center; z-index: 80; }
.modal.hidden{ display:none; }
.modal__backdrop{ position:absolute; inset:0; background: rgba(2,6,23,.6); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.modal__panel{ position:relative; width:min(680px, 92vw); padding:1rem; animation: modalIn .2s ease; }
.modal__header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.5rem; }
.icon-btn{ width: 2rem; height: 2rem; display:grid; place-items:center; border-radius:.75rem; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); }
.icon-btn:hover{ background: rgba(255,255,255,.12); }
@keyframes modalIn{ from{ transform: translateY(6px); opacity:0; } to{ transform:none; opacity:1; } }
.rates-float{ position: fixed; right: 1rem; bottom: 1rem; z-index:70; display:none; }
@media (min-width:1024px){ .rates-float{ display:block; } }
.rates-card{ position:relative; width: 340px; padding: .75rem; }
.rates-close{ position:absolute; top:.5rem; right:.5rem; }
.rates-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:.5rem; }
.rate-item{ padding:.5rem .6rem; border-radius:.75rem; background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); }
.smooth{ transition: all .3s ease; }
.fade-in{ animation: fade .35s ease both; }
@keyframes fade{ from{ opacity:0; transform: translateY(4px);} to{ opacity:1; transform:none;} }
*::-webkit-scrollbar{ width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.12); border-radius: 10px; }
*::-webkit-scrollbar-track{ background: rgba(255,255,255,.04); }


.team-grid{ display:grid; grid-template-columns: repeat(1,minmax(0,1fr)); gap:1rem; }
@media (min-width:768px){ .team-grid{ grid-template-columns: repeat(3,minmax(0,1fr)); } }

.team-card{
  position: relative;
  display:flex; flex-direction:column;
  min-height: 220px; height:100%;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 1rem;
  padding: 1rem;
  background: radial-gradient(120% 140% at 0% 0%,
    rgba(34,211,238,.08) 0%,
    rgba(168,85,247,.06) 45%,
    rgba(99,102,241,.05) 100%),
    rgba(var(--glass-bg), var(--glass-alpha));
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 20px 60px rgba(0,0,0,.35);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  cursor: pointer;
}
.team-card:hover{
  transform: translateY(-2px) scale(1.015);
  box-shadow: 0 16px 44px rgba(0,0,0,.38), 0 0 0 1px rgba(255,255,255,.06) inset;
}

.team-head{ display:flex; align-items:center; gap:1rem; margin-bottom:.5rem; }
.avatar-ring{ background: linear-gradient(135deg, rgba(34,211,238,.7), rgba(168,85,247,.7)); padding:2px; border-radius:9999px; }
.avatar{ width:56px; height:56px; border-radius:9999px; object-fit:cover; background:#0b1220; display:block; }

.h-name{ font-weight:800; line-height:1.1; font-size:clamp(1rem,.9rem + .4vw,1.25rem); }
.h-role{ color:rgba(148,163,184,1); font-size:.875rem; line-height:1.25; white-space:pre-line; }

.p-text{ color:rgb(203 213 225); font-size:.9375rem; line-height:1.55; }
.meta{ margin-top:.75rem; display:flex; flex-wrap:wrap; gap:.5rem; }

/* выровненные «точки» */
.dot-list{ display:flex; flex-direction:column; gap:.125rem; }
.dot{ position:relative; padding-left:.9rem; }
.dot::before{ content:"•"; position:absolute; left:0; top:0; color:rgba(148,163,184,1); }

/* ===== MODAL (ровный контейнер и крестик) ===== */
.modal{ padding: 24px; }
.modal__panel{
  width:min(860px, 92vw);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 1rem;
  background: rgba(var(--glass-bg), var(--glass-alpha));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 24px 70px rgba(0,0,0,.45);
}
.modal__header{ padding:.5rem 2.25rem .5rem .75rem; } /* запас справа под крестик */
.modal__close{
  position:absolute; top:.5rem; right:.5rem;
  width: 2rem; height: 2rem; display:grid; place-items:center;
  border-radius:.75rem; background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
}
.modal__close:hover{ background: rgba(255,255,255,.12); }

/* крупный аватар в модалке — всегда ровный круг */
.modal-portrait{
  width: 220px; height: 220px; border-radius: 9999px; object-fit: cover;
  background:#0b1220; display:block;
  border: 2px solid rgba(34,211,238,.35);
}

/* горизонтальная сетка модалки: слева фото, справа инфо */
.modal-body{
  display:grid; gap:1rem; align-items:center;
  grid-template-columns: 240px 1fr;
}


@media (max-width: 640px){
  .modal-body{ grid-template-columns: 1fr; }
}

/* ровные инфо-блоки */
.info-box{
  border-radius:.75rem; padding:.75rem;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
}
.info-title{ color:rgb(148 163 184); font-size:.75rem; margin-bottom:.25rem; letter-spacing:.02em; text-transform:uppercase; }


.input.star-select {
  background: rgba(148,163,184,.10); /* спокойный фон поля */
  color: #cbd5e1; /* slate-300 */
  border: 1px solid rgba(255,255,255,.06);
}

/* стили внутренних пунктов — поддержка зависит от браузера */
.input.star-select option{
  background: #3c4968;
  color: #2cd4da; /* slate-200 */
}
.input.star-select option:hover,
.input.star-select option:checked{
  background: #3c4968; /* slate-900 */
  color: #facc15;       /* мягкий жёлтый */
}

/* .modal__panel img.modal-portrait,
.modal__close { position: absolute; top: .5rem; right: .5rem; z-index: 50; } */

.glass-card img.modal-portrait {
  width: 220px !important;
  height: 220px !important;
  max-width: none !important;   /* перебивает img{max-width:100%} из Tailwind */
  object-fit: cover !important;
  object-position: center;
  border-radius: 9999px;
  display: block;
}
.site-header{
  position: sticky;
  top: 0;
  z-index: 900;
}
#mobileOverlay{
  z-index: 1100; 
}

.modal{
  z-index: 1200; 
}
@media (max-width: 767.98px){ nav[data-desktop]{ display: none !important; } }
@media (min-width: 768px){    nav[data-desktop]{ display: flex !important; gap: 1.5rem; } }
.is-hidden { display: none; }
.mobile-overlay { opacity: 0; transition: opacity .2s ease; }
.mobile-overlay.show { opacity: 1; }

/* === Mobile overlay/drawer — общее для всех страниц === */
.mobile-overlay {
  opacity: 0;
  pointer-events: none;           /* чтоб в закрытом состоянии не блокировал клики */
  transition: opacity .2s ease;
}

.mobile-overlay.show {
  opacity: 1;
  pointer-events: auto;           /* а в открытом — принимал клики */
}

.mobile-drawer {
  transform: translateX(100%);    /* спрятан справа */
  transition: transform .25s ease;
  overflow: auto;                 /* скролл внутри дроуэра */
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;   /* не «прокручивать» фон под iOS/Android */
}

.mobile-overlay.show .mobile-drawer {
  transform: translateX(0);       /* выезд дроуэра */
}

/* Удобный утилитарный класс для длинных строк (крипто-адреса, ссылки) */
.break-anywhere {
  word-break: break-word;
  overflow-wrap: anywhere;
}