
:root{
  --bg:#0d1023; --bg-alt:#111436; --ink:#f3f4ff; --muted:#b5b9e3;
  --card:#191c3d; --line:#2a2f5b; --brand:#8b5cf6; --brand-2:#60a5fa;
  --glow:0 10px 30px rgba(139,92,246,.35); --soft:0 10px 24px rgba(0,0,0,.25);
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{
  margin:0; background:radial-gradient(1000px 600px at 10% -10%, rgba(96,165,250,.20), transparent 60%),
             radial-gradient(900px 600px at 90% 0%, rgba(139,92,246,.18), transparent 55%),
             var(--bg);
  color:var(--ink);
  font-family:Poppins,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  line-height:1.6;
}
a{color:#a5c7ff; text-decoration:none} a:hover{color:#dbe9ff}
.hidden{display:none!important}
.container{max-width:1180px; margin:0 auto; padding:1.2rem}
.narrow{max-width:900px}
.fx-between{display:flex; align-items:center; justify-content:space-between; gap:1rem}
.wrap{flex-wrap:wrap}
.skip{position:absolute; left:-9999px}

/* Topbar / nav buttons */
.topbar{position:sticky; top:0; z-index:50; background:rgba(13,16,35,.75); backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
.brand-logo{font-weight:800; letter-spacing:.4px; font-size:1.15rem; background:linear-gradient(90deg,var(--brand),var(--brand-2)); -webkit-background-clip:text; background-clip:text; color:transparent}
.nav{display:flex; align-items:center; gap:.6rem; flex-wrap:wrap}
.nav-link{display:inline-block; padding:.46rem .8rem; border-radius:12px; color:var(--ink); background:transparent; border:1px solid transparent; transition:background .15s ease, border-color .15s ease, color .15s ease}
.nav-link:hover{background:rgba(96,165,250,.12); border-color:var(--line); color:#eaf2ff}
.nav-link[aria-current="page"]{background:rgba(96,165,250,.16); border-color:#79b2ff; color:#ffffff}
.lang{display:flex; gap:.4rem}
.btn{display:inline-block; border:0; border-radius:12px; padding:.72rem 1rem; background:linear-gradient(90deg,var(--brand),var(--brand-2)); color:white; font-weight:700; box-shadow:var(--glow)}
.btn.outline{background:transparent; border:2px solid var(--line); color:#e6ebff; box-shadow:none}
.btn.small{padding:.38rem .64rem; line-height:1}
.btn:focus-visible, .nav .nav-link:focus-visible { outline:3px solid #60a5fa; outline-offset:2px }

/* Hero split */
.hero.split{padding:1rem 0 0}
.split-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:1.4rem; align-items:center}
@media(max-width:980px){.split-grid{grid-template-columns:1fr}}
.display{font-family:Merriweather,Georgia,serif; font-size:2.4rem; line-height:1.15; margin:.2rem 0 .6rem}
.lead{color:var(--muted); margin:0 0 1rem}
.cta{display:flex; gap:.6rem; flex-wrap:wrap}
.badges{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.6rem; padding:0; margin:1rem 0 0}
.badges li{list-style:none; background:linear-gradient(180deg,rgba(139,92,246,.14),rgba(96,165,250,.10)); border:1px solid var(--line); color:#d7dbff; padding:.45rem .6rem; border-radius:12px}

/* Masonry gallery (index only) */
.masonry-3{display:grid; grid-template-columns:1fr 1fr; grid-auto-rows:1fr; gap:.9rem}
.masonry-3 .tall{grid-row:span 2}
.tile{background:var(--card); border:1px solid var(--line); border-radius:14px; overflow:hidden; box-shadow:var(--soft); position:relative}
.tile.glow{box-shadow:var(--glow)}
.tile img{display:block; width:100%; height:auto}
.tile figcaption{padding:.5rem .75rem; color:#e8eaff}

/* Band */
.band{background:linear-gradient(180deg,rgba(139,92,246,.14),rgba(96,165,250,.12)); border:1px solid var(--line); border-radius:16px; padding:1rem; margin:1.2rem auto; box-shadow:var(--soft)}
.h3{font-size:1.2rem; margin:.2rem 0 .6rem}
.quick-list{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.6rem; margin:0; padding:0}
.quick-list li{list-style:none; padding:.55rem .7rem; background:var(--card); border:1px solid var(--line); border-radius:12px}

/* Cards / grid */
.card{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:1rem; box-shadow:var(--soft)}
.card.outline{background:rgba(17,20,54,.5)}
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:1rem}
.stack>*+*{margin-top:1rem}
.tight li{margin:.25rem 0}

/* Timeline */
.timeline{list-style:none; padding:0; margin:1rem 0; border-left:3px solid #303769}
.timeline li{padding:.5rem 1rem; margin-left:.5rem; position:relative}
.timeline li::before{content:''; position:absolute; left:-10px; top:.8rem; width:.7rem; height:.7rem; border-radius:50%; background:linear-gradient(90deg,var(--brand),var(--brand-2))}
.timeline.clean{border-left-color:#303769}

/* Tabs */
.tabs{display:flex; gap:.5rem; margin:.6rem 0}
.tab{border:2px solid var(--line); background:transparent; border-radius:999px; padding:.42rem .85rem; cursor:pointer; color:#e6ebff}
.tab.active{border-color:#79b2ff; background:rgba(96,165,250,.12)}
.panels .panel{display:none; border:1px dashed var(--line); border-radius:12px; padding:.8rem; background:rgba(17,20,54,.5)}
.panels .panel.active{display:block}

/* Forms */
.form label{display:flex; flex-direction:column; gap:.35rem; color:#e6e9ff}
.form input,.form select,.form textarea{padding:.65rem .75rem; border-radius:12px; border:1px solid var(--line); background:#0f1330; color:#eaf0ff}
.form textarea{min-height:140px}
.form .consent{font-size:.95rem; color:#c7cdfa}
.success{color:#86efac}

/* Footer */
.footer{margin-top:2rem; border-top:1px solid var(--line); background:rgba(13,16,35,.6)}
.meta-links a{color:#a5c7ff}
/* === Brand logo image === */
.brand-logo {
  width: 140px;         /* увеличь при необходимости */
  height: auto;
  display: block;
  border-radius: 12px;  /* убери, если не нужно округление */
  box-shadow: 0 0 12px rgba(96,165,250,.3);
  transition: transform .2s ease, box-shadow .2s ease;
}

.brand-logo:hover {
  transform: scale(1.05);
  box-shadow: 0 0 18px rgba(139,92,246,.4);
}
