:root{
  --ink:#0e1a2e;
  --ink-soft:#152442;
  --card:#162947;
  --card-border:#2a3f66;
  --paper:#eef1f8;
  --paper-dim:#a7b3cc;
  --gold:#e0a94a;
  --gold-soft:#eec583;
  --rose:#5b8def;
  --line: rgba(238,241,248,0.14);
  --radius: 18px;
  --avatar-radius: 16px;
  --font-display:'Fraunces', serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
}
/* --------------------Menu----------------------- */
.top-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.6); 
  backdrop-filter: blur(10px); 
  display: flex;
  justify-content: space-between; 
  align-items: center;
  padding: 10px 40px;
  box-sizing: border-box;
  z-index: 1000;
}

/* Одинаковая ширина боковых блоков для точной центровки */
.logo, .lang-switch {
  width: 120px; 
  flex-shrink: 0;
}

.logo img {
  height: 40px;
  display: block;
}

/* Ссылки меню */
.menu-links {
  display: flex;
  justify-content: center;
  flex-wrap: wrap; /* Позволяет ссылкам переноситься на мобильных */
}

.menu-links a {
  color: #fff;
  text-decoration: none;
  padding: 10px 15px;
  font-size: 16px;
  transition: background 0.3s;
}

.menu-links a:hover {
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 4px;
}

/* Ссылки переключения языков */
.lang-switch {
  display: flex;
  justify-content: flex-end; 
  align-items: center;
}

.lang-link {
  color: rgba(255, 255, 255, 0.6); 
  text-decoration: none;
  font-size: 14px;
  font-weight: bold;
  padding: 5px;
  transition: color 0.3s;
}

.lang-link:hover, .lang-link.active {
  color: #fff; 
}

.lang-divider {
  color: rgba(255, 255, 255, 0.4);
  margin: 0 2px;
}

/* Автоматическая адаптация под мобильные устройства */
@media (max-width: 768px) {
  .top-menu {
    flex-direction: column; /* Выстраиваем логотип, меню и языки друг под другом */
    gap: 10px;
    padding: 15px 20px;
  }

  .logo, .lang-switch {
    width: auto; /* Сбрасываем фиксированную ширину */
    justify-content: center;
  }
  
  .menu-links a {
    padding: 5px 10px;
    font-size: 14px;
  }
}
/* --------------------Menu----------------------- */
a{color:inherit;}

/* ---------- layout shell ---------- */
.wrap{
  max-width:960px;
  margin:0 auto;
  padding:0 24px;
}

/* ---------- hero ---------- */
.hero{
  position:relative;
  padding:72px 0 0px;
  border-bottom:1px solid var(--line);
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute;
  top:-120px; right:-120px;
  width:380px; height:380px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(91,141,239,0.28), transparent 70%);
  pointer-events:none;
}
.eyebrow{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold-soft);
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:22px;
}
.eyebrow::before{
  content:"";
  width:26px; height:1px;
  background:var(--gold-soft);
  display:inline-block;
}
h1.title{
  font-family:var(--font-display);
  font-weight:600;
  font-size:clamp(10px,2.0vw, 600px);
  line-height:1.04;
  margin:0 0 18px;
  max-width:50ch;
  letter-spacing:-0.01em;
}
.hero-desc{
  font-size:16.5px;
  color:var(--paper-dim);
  max-width:56ch;
  margin:0 0 32px;
}
.hero-meta{
  display:flex;
  flex-wrap:wrap;
  gap:28px 40px;
}
.meta-item{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.meta-item .lbl{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--paper-dim);
}
.meta-item .val{
  font-size:16px;
  font-weight:600;
}
.meta-item .val em{
  font-style:normal;
  color:var(--gold);
}
.section-title{
  margin-top: -3%;
  
  color: #e0a94a;
  padding: 0%;
}

/* ---------- day tabs ---------- */
.day-tabs{
  display:flex;
  gap:8px;
  margin:40px 0 0;
  flex-wrap:wrap;
  justify-content: center;
}
.day-tab{
  
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.03em;
  background:transparent;
  color:var(--paper-dim);
  border:1px solid var(--card-border);
  border-radius:8px;
  padding:9px 15px;
  cursor:pointer;
  transition:all .2s ease;
}
.day-tabs-time{
  padding: 10px;
  display:flex;
  font-size: 20px;
  font-weight: 500;
  justify-content: center;
  
}
.day-tab:hover{ border-color:var(--gold-soft); color:var(--paper); }
.day-tab.active{
  background:var(--gold);
  border-color:var(--gold);
  color:#20180a;
  font-weight:600;
}

/* ---------- timeline ---------- */
.timeline-section{ padding:56px 0 40px; }
.timeline{
  position:relative;
  padding-left:88px;
}
.timeline::before{
  content:"";
  position:absolute;
  left:56px;
  top:6px; bottom:6px;
  width:1px;
  background:repeating-linear-gradient(
    to bottom,
    var(--line) 0px, var(--line) 5px,
    transparent 5px, transparent 11px
  );
}

.slot{
  position:relative;
  margin-bottom:36px;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .55s ease, transform .55s ease;
}
.slot.visible{ opacity:1; transform:translateY(0); }

.slot-time{
  position:absolute;
  left:-15%;
  top:2px;
  width:72px;
  text-align:right;
  font-family:var(--font-mono);
  font-size:18px;
  color:var(--gold-soft);
  line-height:1.35;
}
.slot-time .end{
  display:block;
  color:var(--paper-dim);
  font-size:16px;
  opacity:.75;
}

.slot-node{
  position:absolute;
  left:-36px;
  top:6px;
  width:11px; height:11px;
  border-radius:3px;
  background:var(--ink);
  border:2px solid var(--gold);
}
.slot.break .slot-node{ border-color:var(--paper-dim); }

/* break / pause row */
.slot.break .card{
  background:transparent;
  border:1px dashed var(--card-border);
  box-shadow:none;
  padding:14px 20px;
}
.slot.break .break-label{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--paper-dim);
  letter-spacing:.04em;
}

.card{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:var(--radius);
  padding:22px 24px;
  display:flex;
  gap:22px;
}

.avatar{
  flex:0 0 auto;
  width:200px; height:300px;
  border-radius:var(--avatar-radius);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-display);
  font-weight:600;
  font-size:28px;
  color:#0e1a2e;
  overflow:hidden;
  background:linear-gradient(135deg, var(--gold-soft), var(--rose));
}
.avatar img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
}

.card-body{ flex:1; min-width:0; }

.track-badge{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--rose);
  border:1px solid rgba(91,141,239,0.45);
  border-radius:6px;
  padding:2px 9px;
  margin-bottom:10px;
}

.topic{
  font-family:var(--font-display);
  font-size:20px;
  font-weight:600;
  line-height:1.28;
  margin:0 0 8px;
  color:var(--paper);
}

.speaker-line{
  font-size:14px;
  font-style: italic;
  color:var(--gold-soft);
  margin:0 0 12px;
  font-weight:600;
}
.speaker-line span{
  font-style: normal;
  color:var(--paper-dim);
  font-weight:400;
}

.thesis{
  font-size:14.5px;
  color:var(--paper-dim);
  line-height:1.6;
  margin:0;
}


/* ---------- footer ---------- */
.site-footer{
  border-top:1px solid var(--line);
  padding:36px 0 56px;
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:16px;
  font-size:13.5px;
  color:var(--paper-dim);
}
.site-footer .fname{ color:var(--paper); font-weight:600; }

/* ---------- responsive ---------- */
@media (max-width: 640px){
  .timeline{ padding-left:76px; }
  .timeline::before{ left:36px; }
  .slot-time{ left:-76px; width:58px; font-size:11.5px; }
  .slot-node{ left:-25px; }
  .card{ flex-direction:column; padding:18px; gap:14px; }
  .avatar{ width:72px; height:72px; font-size:23px; border-radius:14px; }
  .topic{ font-size:18px; }
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .slot{ transition:none; opacity:1; transform:none; }
}

:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
}