.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  background: var(--bg);
  border-bottom: var(--border);
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  height: 60px;
}
.nav__brand {
  display: flex;
  align-items: center;
  padding: 0 var(--pad-x);
  border-right: var(--border);
  font-family: var(--font-display);
  font-size: 13px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  background: var(--ink);
  color: var(--bg);
  white-space: nowrap;
}
.nav__brand em { color: var(--accent); font-style: normal; margin-left: 4px; }

.nav__menu { display: none; align-items: stretch; flex: 1; justify-content: flex-end; }
.nav__link {
  display: flex;
  align-items: center;
  padding: 0 20px;
  border-left: var(--border);
  font-family: var(--font-display);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.nav__link:hover { background: var(--ink); color: var(--highlight); }

.nav__lang { display: flex; align-items: stretch; border-left: var(--border); }
.nav__lang button {
  padding: 0 16px;
  font-family: var(--font-display);
  font-size: 12px;
  text-transform: uppercase;
  color: var(--ink);
}
.nav__lang button.is-active { background: var(--accent); color: var(--bg); }
.nav__lang button:hover:not(.is-active) { background: var(--ink); color: var(--bg); }

.nav__burger {
  display: flex;
  align-items: center;
  padding: 0 20px;
  border-left: var(--border);
  background: var(--highlight);
  font-family: var(--font-display);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  gap: 8px;
}
.nav__burger:hover { background: var(--ink); color: var(--highlight); }

.nav__drawer {
  position: fixed;
  top: 60px; left: 0; right: 0;
  background: var(--bg);
  border-bottom: var(--border);
  z-index: 99;
  display: none;
  flex-direction: column;
}
.nav__drawer.is-open { display: flex; }
.nav__drawer a {
  padding: 18px var(--pad-x);
  border-bottom: var(--border);
  font-family: var(--font-display);
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.nav__drawer a:last-child { border-bottom: none; }
.nav__drawer a:hover { background: var(--ink); color: var(--highlight); }
.nav__drawer a span:last-child { color: var(--accent); }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 24px;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
  border: none;
  border-bottom: var(--border);   
  text-align: center;
  transition: none;
}
.btn:last-child {
  border-bottom: none;             
}
.btn:hover {
  background: var(--ink);
  color: var(--highlight);
}
.btn--primary {
  background: var(--accent);
  color: var(--bg);
}
.btn--primary:hover {
  background: var(--ink);
  color: var(--accent);
}

.tag {
  font-size: 10px;
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 4px 8px;
  border: 2px solid var(--ink);
  background: var(--bg);
}

.marquee {
  background: var(--ink);
  color: var(--highlight);
  border-top: var(--border);
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  padding: 14px 0;
  font-family: var(--font-display);
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  white-space: nowrap;
  margin-top: auto;
  position: relative;
}
.marquee__track {
  display: inline-flex;
  width: max-content;
  animation: marquee 28s linear infinite;
  will-change: transform;
}
.marquee__track span { padding: 0 24px; }
.marquee__track .sep { color: var(--accent); padding: 0; }

@keyframes marquee {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}

.to-top {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  border: var(--border);
  background: var(--ink);
  color: var(--highlight);
  font-family: var(--font-display);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  box-shadow: var(--shadow-sm);
}
.to-top:hover { background: var(--accent); color: var(--bg); }

.modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(10, 10, 10, 0.85);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.modal.is-open { display: flex; }
.modal__box {
  background: var(--bg);
  border: var(--border-thick);
  box-shadow: var(--shadow);
  width: 100%;
  max-width: 1000px;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
}
.modal__head {
  background: var(--ink);
  color: var(--highlight);
  padding: 16px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: var(--border);
}
.modal__title {
  font-family: var(--font-display);
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.modal__close {
  background: var(--accent);
  color: var(--bg);
  font-family: var(--font-display);
  font-size: 18px;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--ink);
}
.modal__close:hover { background: var(--ink); color: var(--accent); }
.modal__body {
  padding: 20px;
  overflow-y: auto;
}
.modal__gallery {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media (min-width: 700px) {
  .modal__gallery { grid-template-columns: repeat(2, 1fr); }
}
.modal__gallery img {
  border: var(--border);
  width: 100%;
  height: auto;
  display: block;
}