:root {
  --bg: #000;
  --surface: #1d1d1f;
  --text: #fff;
  --muted: #c4c4c4;
  --blue: #1977f3;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--surface);
  color: var(--text);
  font-family: "Onest", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }

.hero {
  position: relative;
  width: 100%;
  height: 1246px;
  background: #000;
  overflow: hidden;
}

.site-header {
  position: relative;
  z-index: 20;
  height: 82px;
  background: #000;
}
.brand {
  position: absolute;
  left: max(24px, calc((100vw - 1440px) / 2));
  top: 20px;
  width: 131px;
  height: 44px;
}
.brand img { display: block; width: 131px; height: 44px; }
.desktop-nav {
  position: absolute;
  top: 31px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 52px;
  align-items: center;
  white-space: nowrap;
}
.desktop-nav a {
  color: #c4c4c4;
  font-size: 17px;
  font-weight: 500;
  transition: color .2s ease;
}
.desktop-nav a:hover { color: #fff; }
.desktop-actions {
  position: absolute;
  top: 22px;
  right: max(24px, calc((100vw - 1440px) / 2));
  height: 40px;
  display: flex;
  align-items: center;
  gap: 36px;
}
.header-cta {
  width: 206px;
  height: 40px;
  border-radius: 9px;
  background: var(--blue);
  display: grid;
  place-items: center;
  font-size: 17px;
  font-weight: 500;
  transition: transform .2s ease, background .2s ease;
}
.header-cta:hover, .primary-button:hover { background: #2c83f4; transform: translateY(-1px); }
.language-button {
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.language-button img { width: 30px; height: 30px; display: block; }
.language-menu {
  position: absolute;
  right: 0;
  top: 54px;
  width: 109px;
  padding: 10px 0;
  border-radius: 8px;
  background: #111;
  border: 1px solid #2a2a2a;
  display: none;
}
.language-menu.open { display: block; }
.language-menu button {
  width: 100%;
  border: 0;
  background: transparent;
  color: #aaa;
  text-align: left;
  padding: 7px 14px;
  cursor: pointer;
}
.language-menu button.active, .language-menu button:hover { color: #fff; }
.mobile-languages, .menu-button, .mobile-menu { display: none; }

.hero-media {
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  top: 82px;
  height: 959px;
  overflow: hidden;
  background: #000;
}
.hero-video {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  height: 790px;
  object-fit: cover;
  max-width: none;
}
.hero-video-mobile { display: none; }
.hero-gradient {
  position: absolute;
  inset: 185px 0 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.22) 32%, #000 70%);
}

.hero-content {
  position: relative;
  z-index: 5;
  height: calc(100% - 82px);
  max-width: 1440px;
  margin: 0 auto;
}
.hero-content h1 {
  position: absolute;
  left: 0;
  top: 517px;
  margin: 0;
  width: 1100px;
  font-size: 65px;
  line-height: 1.36;
  letter-spacing: -1.3px;
  font-weight: 500;
}
.hero-copy {
  position: absolute;
  left: 0;
  top: 735px;
  width: 698px;
  margin: 0;
  color: var(--muted);
  font-size: 19px;
  line-height: 1.35;
  font-weight: 400;
}
.hero-tags { position: absolute; inset: 0; }
.tag {
  position: absolute;
  height: 32px;
  padding: 0 15px 0 40px;
  display: flex;
  align-items: center;
  border-radius: 22px;
  background: #fff;
  color: #515151;
  font-size: 19px;
  line-height: 1;
  font-weight: 500;
  white-space: nowrap;
}
.tag i {
  position: absolute;
  left: 10px;
  width: 14px;
  height: 14px;
  border: 3px solid #1977f3;
  border-radius: 50%;
}
.tag i::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fff;
  left: 2px;
  top: 2px;
}
.tag-exhibitions { left: 316px; top: 130px; }
.tag-museums { left: 924px; top: 85px; }
.tag-architecture { left: 1003px; top: 169px; }
.tag-culture { left: 197px; top: 214px; }
.tag-tourism { left: 938px; top: 253px; }
.hero-buttons {
  position: absolute;
  left: 50%;
  top: 823px;
  transform: translateX(-50%);
  display: flex;
  gap: 12px;
}
.primary-button {
  width: 351px;
  height: 54px;
  background: var(--blue);
  border-radius: 9px;
  display: grid;
  place-items: center;
  font-size: 21px;
  line-height: 1;
  font-weight: 500;
  transition: transform .2s ease, background .2s ease;
}
.hero-bottom {
  position: absolute;
  z-index: 7;
  left: 0;
  bottom: 0;
  width: 100%;
  pointer-events: none;
}
.hero-bottom-desktop { height: 220px; object-fit: fill; }
.hero-bottom-mobile { display: none; }

.next-section {
  min-height: 620px;
  background: #1d1d1f;
  padding: 120px 30px;
}
.container { max-width: 1440px; margin: 0 auto; }
.next-section h2 { font-size: 56px; margin: 0 0 24px; font-weight: 500; }
.next-section p { color: #aaa; font-size: 18px; }

@media (max-width: 1500px) and (min-width: 769px) {
  .hero-content { max-width: calc(100% - 270px); }
  .brand { left: 9.2vw; }
  .desktop-actions { right: 9.2vw; }
  .desktop-nav { gap: 38px; }
  .hero-content h1 { font-size: clamp(49px, 4.4vw, 65px); width: 76vw; }
  .tag-exhibitions { left: 28%; }
  .tag-museums { left: 65%; }
  .tag-architecture { left: 70%; }
  .tag-culture { left: 20%; }
  .tag-tourism { left: 66%; }
}

@media (max-width: 1100px) and (min-width: 769px) {
  .desktop-nav { gap: 20px; left: 49%; }
  .desktop-nav a { font-size: 14px; }
  .desktop-actions { gap: 16px; }
  .header-cta { width: 170px; font-size: 14px; }
}

@media (max-width: 768px) {
  body { background: #1d1d1f; }
  .hero {
    height: 1448px;
    min-height: 1448px;
  }
  .site-header {
    height: 100px;
    background: #000;
  }
  .brand {
    left: 30px;
    top: 50px;
    width: 102px;
    height: auto;
  }
  .brand img { width: 102px; height: auto; }
  .desktop-nav, .desktop-actions { display: none; }
  .mobile-languages {
    display: flex;
    position: absolute;
    right: 30px;
    top: 18px;
    align-items: center;
    gap: 9px;
  }
  .mobile-languages button {
    padding: 0;
    border: 0;
    background: none;
    color: #b2b2b2;
    font-size: 11px;
    font-weight: 500;
  }
  .mobile-languages button.active { color: #fff; }
  .mobile-languages span { width: 1px; height: 13px; background: #b2b2b2; }
  .menu-button {
    display: block;
    position: absolute;
    right: 30px;
    top: 56px;
    width: 23px;
    height: 23px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
  }
  .menu-button span {
    position: absolute;
    left: 1px;
    width: 22px;
    height: 2px;
    background: #fff;
    transition: transform .2s ease, top .2s ease;
  }
  .menu-button span:first-child { top: 5px; }
  .menu-button span:last-child { top: 15px; }
  .menu-button.open span:first-child { top: 10px; transform: rotate(45deg); }
  .menu-button.open span:last-child { top: 10px; transform: rotate(-45deg); }

  .hero-media {
    top: 100px;
    height: 506px;
  }
  .hero-video-desktop { display: none; }
  .hero-video-mobile {
    display: block;
    width: 360px;
    height: 504px;
    object-fit: cover;
  }
  .hero-gradient {
    inset: 255px 0 0;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.3) 20%, #000 84%);
  }
  .hero-content {
    height: auto;
    max-width: none;
    margin: 0;
  }
  .hero-content h1 {
    left: 30px;
    top: 453px;
    width: calc(100% - 60px);
    font-size: 33px;
    line-height: 1.35;
    letter-spacing: -.3px;
  }
  .desktop-only { display: none; }
  .hero-copy {
    left: 30px;
    top: 651px;
    width: calc(100% - 60px);
    font-size: 15px;
    line-height: 1.36;
  }
  .hero-tags {
    top: 798px;
    left: 30px;
    right: 30px;
    height: 189px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 17px;
  }
  .tag {
    position: relative;
    left: auto !important;
    top: auto !important;
    height: 24px;
    padding: 0 13px 0 36px;
    font-size: 14px;
  }
  .tag i {
    width: 14px;
    height: 14px;
    left: 5px;
  }
  .tag-museums { order: 1; }
  .tag-exhibitions { order: 2; }
  .tag-architecture { order: 3; }
  .tag-culture { order: 4; }
  .tag-tourism { order: 5; }
  .hero-buttons {
    left: 30px;
    right: 30px;
    top: 1096px;
    transform: none;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  .primary-button {
    width: 100%;
    height: 40px;
    font-size: 15px;
  }
  .hero-buttons .primary-button:first-child { order: 2; }
  .hero-buttons .primary-button:last-child { order: 1; }
  .hero-bottom-desktop { display: none; }
  .hero-bottom-mobile {
    display: block;
    height: 113px;
    bottom: 0;
  }
  .mobile-menu {
    display: flex;
    position: absolute;
    z-index: 15;
    top: 100px;
    left: 0;
    width: 100%;
    padding: 28px 30px 36px;
    background: rgba(0,0,0,.97);
    flex-direction: column;
    gap: 24px;
    transform: translateY(-120%);
    opacity: 0;
    pointer-events: none;
    transition: transform .25s ease, opacity .25s ease;
  }
  .mobile-menu.open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }
  .mobile-menu a:not(.primary-button) { font-size: 19px; color: #c4c4c4; }
  .next-section { padding: 80px 30px; min-height: 450px; }
  .next-section h2 { font-size: 36px; }
}

/* Stage 2 — feature carousel */
.features-section {
  position: relative;
  background: #1d1d1f;
  color: #fff;
  min-height: 2011px;
  padding: 139px 0 150px;
  overflow: hidden;
}
.features-inner {
  width: min(1440px, calc(100% - 60px));
  margin: 0 auto;
}
.features-section h2 {
  margin: 0 0 60px;
  font-size: 56px;
  line-height: 1.25;
  font-weight: 500;
  letter-spacing: -1.1px;
}
.feature-carousel { position: relative; }
.feature-track {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 0 0 20px;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
}
.feature-track::-webkit-scrollbar { display: none; }
.feature-card {
  flex: 0 0 351px;
  height: 656px;
  border-radius: 18px;
  background: #000;
  overflow: hidden;
  scroll-snap-align: start;
  border: 1px solid rgba(255,255,255,.04);
}
.feature-card video {
  display: block;
  width: 100%;
  height: 378px;
  object-fit: cover;
  background: #111;
}
.feature-body { padding: 0 30px 28px; }
.feature-body h3 {
  margin: 0;
  padding-top: 0;
  transform: translateY(-1px);
  font-size: 24px;
  line-height: 1.3;
  font-weight: 500;
}
.feature-body p {
  margin: 20px 0 0;
  color: #c4c4c4;
  font-size: 17px;
  line-height: 1.42;
  font-weight: 400;
}
.carousel-controls {
  height: 33px;
  margin: 48px auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;
}
.carousel-arrow {
  width: 33px;
  height: 33px;
  border-radius: 50%;
  border: 1px solid #5f5f61;
  background: transparent;
  color: #fff;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}
.carousel-arrow:disabled { opacity: .35; cursor: default; }
.carousel-progress {
  width: 210px;
  height: 3px;
  background: #464648;
  border-radius: 999px;
  overflow: hidden;
}
.carousel-progress span {
  display: block;
  height: 100%;
  width: 25%;
  background: #fff;
  transform-origin: left center;
  transition: transform .25s ease;
}
.features-subtitle { margin-top: 82px !important; margin-bottom: 60px !important; font-size: 42px !important; }
.feature-extra { display: flex; gap: 12px; }
.feature-extra .feature-card { flex-basis: 351px; }

@media (max-width: 1500px) and (min-width: 769px) {
  .features-inner { width: min(1200px, calc(100% - 270px)); }
  .features-section h2 { font-size: 46px; }
  .feature-card { flex-basis: 392px; height: 684px; }
  .feature-card video { height: 422px; }
  .feature-body h3 { font-size: 24px; }
  .feature-body p { font-size: 16px; }
  .feature-extra .feature-card { flex-basis: 392px; }
}

@media (max-width: 768px) {
  .features-section {
    min-height: 1628px;
    padding: 92px 0 99px;
  }
  .features-inner { width: 100%; }
  .features-section h2 {
    margin: 0 30px 42px;
    font-size: 33px;
    line-height: 1.25;
    letter-spacing: -.4px;
  }
  .feature-carousel { width: 100%; }
  .feature-track {
    gap: 12px;
    padding: 0 30px 16px;
    scroll-padding-inline: 30px;
  }
  .feature-card {
    flex: 0 0 calc(100vw - 60px);
    height: 561px;
    border-radius: 16px;
  }
  .feature-card video { height: 322px; }
  .feature-body { padding: 0 20px 24px; }
  .feature-body h3 { font-size: 21px; line-height: 1.35; }
  .feature-body p { margin-top: 15px; font-size: 15px; line-height: 1.38; }
  .carousel-controls { margin-top: 20px; height: 20px; gap: 12px; }
  .carousel-arrow { display: none; }
  .carousel-progress { width: 169px; height: 3px; }
  .features-subtitle {
    margin: 80px 30px 42px !important;
    font-size: 31px !important;
    line-height: 1.3 !important;
  }
  .feature-extra {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding: 0 30px 8px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .feature-extra::-webkit-scrollbar { display: none; }
  .feature-extra .feature-card {
    flex: 0 0 calc(100vw - 60px);
    scroll-snap-align: start;
  }
}


/* Stage 3 — How NazzAR works */
.how-section {
  background: #1d1d1f;
  padding: 0 0 0;
}
.how-panel {
  position: relative;
  width: min(1703px, calc(100% - 110px));
  height: 1202px;
  margin: 0 auto;
  border-radius: 42px;
  background: #000;
  overflow: hidden;
}
.how-copy {
  position: absolute;
  left: 130px;
  top: 100px;
  width: 714px;
}
.how-copy > h2 {
  margin: 0;
  font-size: 56px;
  line-height: 1.25;
  font-weight: 500;
  letter-spacing: -1px;
}
.how-copy > p {
  width: 593px;
  margin: 42px 0 0;
  color: #c4c4c4;
  font-size: 17px;
  line-height: 1.42;
}
.how-copy .how-note { margin-top: 10px; }
.how-play {
  width: 75px;
  height: 75px;
  margin-top: 56px;
  border: 0;
  border-radius: 50%;
  background: #1977f3;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.how-play span {
  display: block;
  width: 0;
  height: 0;
  margin-left: 5px;
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  border-left: 18px solid #fff;
}
.how-copy > h3 {
  margin: 111px 0 48px;
  font-size: 42px;
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: -.7px;
}
.how-options {
  display: flex;
  gap: 12px;
}
.how-card {
  position: relative;
  width: 351px;
  height: 351px;
  padding: 30px;
  border-radius: 18px;
  background: #fff;
  color: #111;
}
.how-card h4 {
  margin: 0;
  font-size: 27px;
  line-height: 1.2;
  font-weight: 500;
}
.how-card p {
  margin: 24px 0 0;
  font-size: 17px;
  line-height: 1.42;
  color: #4f4f4f;
}
.store-buttons {
  position: absolute;
  left: 30px;
  right: 30px;
  bottom: 30px;
  display: grid;
  gap: 10px;
}
.store-button {
  height: 50px;
  border-radius: 8px;
  background: #000;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 500;
}
.store-icon { width: 22px; text-align: center; font-size: 16px; }
.store-icon.apple { font-size: 14px; }
.store-icon.play { color: #fff; font-size: 14px; }
.qr-placeholder {
  position: absolute;
  left: 50%;
  bottom: 30px;
  transform: translateX(-50%);
  width: 82px;
  height: 82px;
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  grid-template-rows: repeat(9, 1fr);
  gap: 2px;
  padding: 6px;
  background: #fff;
}
.qr-placeholder span { background: transparent; }
.qr-placeholder span:nth-child(3n+1),
.qr-placeholder span:nth-child(4n+2),
.qr-placeholder span:nth-child(7n+4) { background: #000; }
.how-visual {
  position: absolute;
  right: 130px;
  top: 100px;
  width: 717px;
  height: 1002px;
  border-radius: 28px;
  overflow: hidden;
  background: #13232c;
}
.how-tile-pattern {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(20,113,155,.42) 0 12%, transparent 12% 17%, rgba(197,151,81,.24) 17% 24%, transparent 24% 29%, rgba(22,134,153,.35) 29% 37%, transparent 37% 42%, rgba(206,157,77,.28) 42% 48%, transparent 48% 55%, rgba(30,124,171,.38) 55% 66%, transparent 66% 72%, rgba(199,143,71,.28) 72% 79%, transparent 79% 86%, rgba(16,107,151,.4) 86%),
    linear-gradient(#183846 0 43%, #91704e 43% 49%, #32606c 49% 100%);
}
.how-tile-pattern::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 2px, transparent 2px 36px);
  mix-blend-mode: screen;
}
.how-phone-mock {
  position: absolute;
  left: 24%;
  top: 47%;
  width: 58%;
  aspect-ratio: 1.8 / 1;
  border-radius: 24px;
  border: 8px solid #0b0b0c;
  transform: rotate(6deg);
  background: #1c1c1e;
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
}
.how-phone-screen {
  position: absolute;
  inset: 8px;
  border-radius: 14px;
  background: linear-gradient(135deg,#617984,#243b44 54%,#bb8c5e);
}

@media (max-width: 1500px) and (min-width: 769px) {
  .how-panel { width: min(1200px, calc(100% - 270px)); height: 1099px; border-radius: 34px; }
  .how-copy { left: 0; top: 100px; width: 796px; }
  .how-copy > h2 { font-size: 46px; }
  .how-copy > p { font-size: 16px; }
  .how-copy > h3 { font-size: 37px; margin-top: 120px; }
  .how-card { width: 392px; height: 392px; }
  .how-visual { right: 0; top: 451px; width: 392px; height: 548px; border-radius: 22px; }
}

@media (max-width: 768px) {
  .how-section { padding: 0; }
  .how-panel {
    width: 100%;
    height: 1627px;
    border-radius: 0;
  }
  .how-copy {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    padding: 90px 30px 0;
    z-index: 2;
  }
  .how-copy > h2 { font-size: 33px; letter-spacing: -.4px; }
  .how-copy > p { width: 100%; margin-top: 34px; font-size: 15px; line-height: 1.4; }
  .how-copy .how-note { margin-top: 8px; }
  .how-play { width: 64px; height: 64px; margin-top: 36px; }
  .how-play span { border-top-width: 9px; border-bottom-width: 9px; border-left-width: 15px; }
  .how-visual {
    left: 30px;
    right: 30px;
    top: 430px;
    width: auto;
    height: 430px;
    border-radius: 20px;
  }
  .how-copy > h3 {
    margin: 548px 0 34px;
    font-size: 31px;
    line-height: 1.25;
  }
  .how-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .how-card {
    width: 100%;
    height: 290px;
    padding: 24px;
    border-radius: 16px;
  }
  .how-card h4 { font-size: 24px; }
  .how-card p { margin-top: 18px; font-size: 15px; }
  .store-buttons { left: 24px; right: 24px; bottom: 24px; gap: 8px; }
  .store-button { height: 44px; font-size: 14px; }
  .qr-placeholder { width: 70px; height: 70px; bottom: 22px; }
}

/* Stage 4+ — remaining sections */
.section-shell { width: min(1200px, calc(100% - 60px)); margin: 0 auto; }
.section-shell > h2 {
  margin: 0;
  font-size: 56px;
  line-height: 1.25;
  font-weight: 500;
  letter-spacing: -1px;
}
.section-lead { margin: 42px 0 36px; color: #c4c4c4; font-size: 18px; }

.objects-section { background: #1d1d1f; padding: 100px 0 140px; overflow: hidden; }
.objects-section .section-shell > h2 { max-width: 900px; }
.city-filters { display: flex; gap: 10px; margin-bottom: 60px; }
.city-filters button {
  min-width: 115px; height: 35px; padding: 0 28px; border: 0; border-radius: 999px;
  background: #353537; color: #fff; cursor: pointer; font-size: 16px;
}
.city-filters button.active { background: #000; }
.object-track { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.object-track::-webkit-scrollbar { display: none; }
.object-card {
  flex: 0 0 392px; height: 656px; border-radius: 18px; background: #000; overflow: hidden;
  padding-bottom: 30px; display: flex; flex-direction: column; scroll-snap-align: start;
}
.object-photo { position: relative; width: 100%; height: 386px; overflow: hidden; }
.object-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.object-photo::after { content: ""; position: absolute; inset: 52% 0 0; background: linear-gradient(transparent, #000 92%); }
.object-photo > span {
  position: absolute; z-index: 2; top: 15px; right: 15px; padding: 5px 22px; border-radius: 20px;
  background: rgba(255,255,255,.9); color: #333; font-size: 12px;
}
.placeholder-photo { background: linear-gradient(145deg,#32435c,#c1a477 55%,#273349); }
.placeholder-photo.alt { background: linear-gradient(145deg,#554332,#9a765d 48%,#1e2731); }
.object-card h3 { margin: -46px 30px 0; position: relative; z-index: 3; font-size: 25px; line-height: 1.32; font-weight: 500; min-height: 130px; }
.object-actions { margin-top: auto; padding: 0 30px; display: grid; gap: 10px; }
.object-actions a { height: 40px; border-radius: 8px; background: #1977f3; display: grid; place-items: center; font-size: 16px; }
.object-controls { margin-top: 40px; display: flex; justify-content: center; align-items: center; gap: 28px; }
.object-controls button { width: 34px; height: 34px; border: 0; border-radius: 50%; background: #fff; color: #111; cursor: pointer; font-size: 20px; }
.object-dots { display: flex; align-items: center; gap: 14px; }
.object-dots i { width: 9px; height: 9px; border-radius: 50%; background: #3b3b3d; }
.object-dots i.active { width: 30px; border-radius: 999px; background: #fff; }
.object-card.is-hidden { display: none; }

.try-section { background: #1d1d1f; padding: 0 0 100px; }
.try-panel { position: relative; width: min(1469px, 100%); min-height: 751px; margin: 0 auto; border-radius: 42px; background: #000; overflow: hidden; }
.try-copy { position: absolute; left: 9.2%; top: 90px; width: 392px; }
.try-copy h2 { margin: 0; font-size: 56px; line-height: 1.25; font-weight: 500; }
.try-copy p { margin: 60px 0 0; color: #c4c4c4; font-size: 17px; line-height: 1.4; }
.marker-demo { position: absolute; right: 9.2%; top: 90px; width: 695px; height: 488px; background: #fff; display: grid; place-items: center; color: #111; overflow: hidden; }
.marker-grid { position: absolute; inset: 0; background-image: radial-gradient(#111 1px, transparent 1px); background-size: 28px 28px; opacity: .035; }
.marker-demo strong { position: relative; z-index: 1; font-size: 16px; line-height: 1.1; }
.try-nav { position: absolute; right: 16%; bottom: 54px; display: flex; align-items: center; gap: 18px; }
.try-nav span { width: 24px; height: 24px; border-radius: 50%; background: #343438; }
.try-nav i { width: 9px; height: 9px; border-radius: 50%; background: #343438; }
.try-nav i:first-of-type { width: 35px; border-radius: 20px; background: #fff; }
.try-nav button { width: 34px; height: 34px; border-radius: 50%; border: 0; background: #fff; cursor: pointer; font-size: 20px; }

.museum-section { background: #1d1d1f; padding: 150px 0 100px; }
.museum-shell > h2 { max-width: 700px; }
.museum-intro { width: 695px; margin: 38px 0 60px; color: #c4c4c4; font-size: 18px; line-height: 1.45; }
.museum-collage { width: 100%; height: 379px; object-fit: cover; display: block; }
.benefit-grid { margin-top: 135px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 92px 110px; }
.benefit-grid article { position: relative; min-height: 170px; padding-left: 60px; }
.benefit-grid b, .souvenir-benefits b { position: absolute; left: 0; top: 2px; width: 30px; height: 30px; border-radius: 7px; background: #ac866a; display: grid; place-items: center; color: #fff; font-size: 14px; }
.benefit-grid h3, .souvenir-benefits h3 { margin: 0; font-size: 25px; line-height: 1.28; font-weight: 500; }
.benefit-grid p, .souvenir-benefits p { margin: 28px 0 0; color: #c4c4c4; font-size: 17px; line-height: 1.45; }
.wide-button { width: 392px; height: 50px; margin: 95px auto 0; border-radius: 8px; background: #1977f3; display: grid; place-items: center; font-size: 17px; }

.souvenir-section { background: #000; padding: 100px 0 100px; }
.souvenir-shell { position: relative; min-height: 1324px; }
.souvenir-copy { width: 493px; padding-top: 0; }
.tourist-script { font-family: cursive; font-size: 53px; line-height: 1.1; transform: rotate(-1deg); margin-bottom: 34px; }
.special-edition { display: inline-block; padding: 2px 8px; background: #fff; color: #111; font-weight: 700; font-size: 21px; margin-left: 125px; }
.souvenir-copy h2 { margin: 76px 0 0; font-size: 56px; line-height: 1.25; font-weight: 500; }
.souvenir-copy > p { margin: 42px 0 0; color: #c4c4c4; font-size: 18px; line-height: 1.5; }
.souvenir-play { margin-top: 46px; width: 75px; height: 75px; border: 0; border-radius: 50%; background: #1977f3; display: grid; place-items: center; cursor: pointer; }
.souvenir-play span { width: 0; height: 0; margin-left: 6px; border-top: 12px solid transparent; border-bottom: 12px solid transparent; border-left: 20px solid #fff; }
.souvenir-mini { width: 165px; height: 111px; object-fit: cover; margin-top: 56px; transform: rotate(-5deg); }
.souvenir-hero { position: absolute; right: 0; top: 0; width: 594px; height: 857px; object-fit: cover; border-radius: 26px; }
.souvenir-benefits { position: absolute; left: 0; right: 0; top: 985px; display: grid; grid-template-columns: repeat(3,1fr); gap: 60px; }
.souvenir-benefits article { position: relative; min-height: 180px; padding-left: 60px; }
.souvenir-order { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); margin: 0; }

.contact-section { background: #1d1d1f; padding: 100px 0; }
.contact-shell > h2 { font-size: 56px; }
.contact-card { margin-top: 120px; min-height: 205px; border: 1px solid #6a6a6d; border-radius: 28px; padding: 34px 44px; display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 48px; align-items: center; }
.contact-card h3 { margin: 0; font-size: 26px; font-weight: 500; }
.contact-card p { margin: 40px 0 0; color: #c4c4c4; font-size: 17px; line-height: 1.5; }
.contact-method { display: block; }
.contact-method span { width: 42px; height: 42px; border-radius: 10px; background: #1977f3; display: grid; place-items: center; font-size: 22px; }
.contact-method p { margin-top: 26px; }
.contact-method strong { color: #c4c4c4; font-weight: 500; }
.site-footer { background: #000; padding: 60px 0 40px; }
.footer-inner { position: relative; width: min(1200px, calc(100% - 60px)); min-height: 210px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; }
.footer-logo { width: 131px; height: 44px; }
.socials { display: flex; gap: 54px; justify-content: center; }
.socials a { width: 40px; height: 40px; border-radius: 50%; background: #fff; color: #000; display: grid; place-items: center; font-weight: 700; }
.footer-contact { justify-self: end; color: #fff; font-size: 15px; }
.footer-contact p { margin: 0 0 16px; }
.footer-line { position: absolute; left: 0; right: 0; bottom: 48px; height: 1px; background: #333; }
.copyright { position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; margin: 0; color: #8d8d8f; }

@media (max-width: 768px) {
  .section-shell { width: calc(100% - 60px); }
  .section-shell > h2, .contact-shell > h2 { font-size: 33px; line-height: 1.28; letter-spacing: -.4px; }
  .objects-section { padding: 84px 0 90px; }
  .section-lead { margin: 34px 0 28px; font-size: 15px; line-height: 1.4; }
  .city-filters { gap: 8px; overflow-x: auto; margin-bottom: 38px; padding-bottom: 4px; scrollbar-width: none; }
  .city-filters::-webkit-scrollbar { display: none; }
  .city-filters button { min-width: max-content; height: 32px; padding: 0 22px; font-size: 14px; }
  .object-track { gap: 12px; overflow-x: auto; }
  .object-card { flex-basis: 300px; height: 590px; border-radius: 16px; }
  .object-photo { height: 295px; }
  .object-card h3 { margin: -36px 20px 0; font-size: 21px; min-height: 150px; }
  .object-actions { padding: 0 20px; }
  .object-controls { margin-top: 28px; }
  .object-controls button { display: none; }

  .try-section { padding-bottom: 70px; }
  .try-panel { width: 100%; min-height: 590px; border-radius: 30px; }
  .try-copy { position: relative; left: auto; top: auto; width: auto; padding: 68px 30px 0; }
  .try-copy h2 { font-size: 33px; width: 250px; }
  .try-copy p { margin-top: 34px; width: 290px; font-size: 15px; }
  .marker-demo { left: 30px; right: 30px; top: 270px; width: auto; height: 220px; }
  .try-nav { right: 30px; bottom: 32px; }

  .museum-section { padding: 80px 0 80px; }
  .museum-intro { width: auto; margin: 30px 0 45px; font-size: 15px; }
  .museum-collage { width: calc(100% + 60px); margin-left: -30px; height: 245px; object-fit: cover; }
  .benefit-grid { margin-top: 72px; grid-template-columns: 1fr; gap: 58px; }
  .benefit-grid article { min-height: 0; padding-left: 46px; }
  .benefit-grid b, .souvenir-benefits b { width: 28px; height: 28px; }
  .benefit-grid h3, .souvenir-benefits h3 { font-size: 21px; }
  .benefit-grid p, .souvenir-benefits p { margin-top: 18px; font-size: 15px; }
  .wide-button { width: 100%; margin-top: 68px; font-size: 15px; }

  .souvenir-section { padding: 70px 0 80px; }
  .souvenir-shell { min-height: auto; display: flex; flex-direction: column; }
  .souvenir-copy { width: auto; }
  .tourist-script { font-size: 37px; }
  .special-edition { margin-left: 70px; font-size: 16px; }
  .souvenir-copy h2 { margin-top: 52px; font-size: 33px; }
  .souvenir-copy > p { margin-top: 28px; font-size: 15px; }
  .souvenir-play { width: 60px; height: 60px; margin-top: 34px; }
  .souvenir-mini { width: 120px; height: 81px; margin-top: 38px; }
  .souvenir-hero { position: relative; right: auto; top: auto; order: 2; width: 100%; height: auto; aspect-ratio: 0.693; margin-top: 44px; border-radius: 20px; }
  .souvenir-copy { order: 1; }
  .souvenir-benefits { position: relative; top: auto; left: auto; right: auto; order: 3; display: grid; grid-template-columns: 1fr; gap: 50px; margin-top: 64px; }
  .souvenir-benefits article { min-height: 0; padding-left: 46px; }
  .souvenir-order { position: relative; left: auto; bottom: auto; transform: none; order: 4; margin-top: 60px; width: 100%; }

  .contact-section { padding: 76px 0; }
  .contact-card { margin-top: 64px; padding: 30px 24px; grid-template-columns: 1fr; gap: 42px; border-radius: 20px; }
  .contact-card h3 { font-size: 23px; }
  .contact-card p { margin-top: 20px; font-size: 15px; }
  .contact-method p { margin-top: 18px; }

  .site-footer { padding: 44px 0 30px; }
  .footer-inner { min-height: 330px; grid-template-columns: 1fr; gap: 34px; }
  .footer-logo { justify-self: start; }
  .socials { justify-content: flex-start; gap: 28px; }
  .footer-contact { justify-self: start; font-size: 14px; }
  .footer-line { bottom: 48px; }
}

/* Checked build — functional and responsive repairs, original artwork unchanged. */
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid #91bdff; outline-offset: 5px; }
html { scroll-padding-top: 24px; }
section, #download { scroll-margin-top: 24px; }
button { color: inherit; }
a, button { touch-action: manipulation; }
.skip-link { position: fixed; top: -90px; left: 20px; z-index: 100; background: white; color: black; padding: 14px 20px; border-radius: 6px; }
.skip-link:focus { top: 15px; }
.site-header { display: flex; align-items: center; padding-inline: max(30px, calc((100% - 1440px) / 2)); gap: 0; }
.brand { position: static; flex: 0 0 131px; margin-right: auto; }
.desktop-nav { position: static; transform: none; }
.desktop-actions { position: relative; top: auto; right: auto; margin-left: 78px; }
.learn-more-hit { position: absolute; z-index: 6; bottom: 0; left: 50%; transform: translateX(-50%); width: 157px; height: 157px; border-radius: 50%; }
.motion-toggle { position: absolute; z-index: 7; right: 30px; bottom: 94px; padding: 8px 12px; border: 1px solid #777; border-radius: 6px; color: #c4c4c4; background: #101010; font-size: 12px; cursor: pointer; }
.feature-card { height: auto; min-height: 656px; }
.feature-extra { overflow-x: auto; }
.feature-body { padding-bottom: 32px; }
.feature-card video { aspect-ratio: 718 / 776; object-fit: cover; }
.object-controls button:disabled { opacity: .3; cursor: default; }
.object-counter { min-width: 80px; text-align: center; color: var(--muted); font-size: 14px; }
.object-track, .feature-track, .feature-extra { overscroll-behavior-inline: contain; }
.object-card { max-width: 100%; }
.asset-label { position: absolute; z-index: 5; left: 20px; right: 20px; bottom: 20px; padding: 10px 12px; background: rgba(0,0,0,.78); color: #fff; font: 13px/1.4 "Onest", Arial, sans-serif; text-align: center; border-radius: 6px; }
.how-panel { height: auto; min-height: 1202px; width: min(1703px, calc(100% - 60px)); padding: 100px clamp(32px, 6.77vw, 130px); display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); grid-template-areas: "intro visual" "choice visual"; grid-template-rows: auto 1fr; gap: 80px 12px; }
.how-copy { display: contents; }
.how-intro { grid-area: intro; min-width: 0; }
.how-intro h2 { margin: 0; font-size: 56px; line-height: 1.25; font-weight: 500; letter-spacing: -1px; }
.how-intro p { width: min(593px,100%); color: var(--muted); font-size: 17px; line-height: 1.42; margin: 42px 0 0; }
.how-intro .how-note { margin-top: 10px; }
.how-choice { grid-area: choice; min-width: 0; align-self: end; }
.how-choice > h3 { margin: 0 0 48px; font-size: 42px; line-height: 1.2; font-weight: 500; letter-spacing: -.7px; }
.how-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.how-card { width: auto; height: auto; min-height: 351px; display: flex; flex-direction: column; }
.how-card p { margin-bottom: 26px; }
.store-buttons { position: static; margin-top: auto; }
.qr-pending { margin-top: auto !important; font-size: 13px !important; background: #f1f1f1; border-radius: 8px; padding: 12px; color: #555 !important; }
.how-visual { grid-area: visual; position: relative; inset: auto; width: 100%; height: auto; min-height: 800px; }
.try-panel { display: grid; grid-template-columns: minmax(0,.7fr) minmax(0,1fr); gap: 48px 60px; width: min(1469px,calc(100% - 60px)); padding: 90px clamp(30px,6vw,110px); min-height: 0; }
.try-copy { position: static; width: auto; padding: 0; }
.try-copy h2, .try-copy p { width: auto; }
.marker-demo { position: relative; inset: auto; width: 100%; height: auto; min-height: 350px; }
.marker-demo strong { text-align: center; color: #515151; font-size: 17px; line-height: 1.5; padding: 20px; }
.try-nav { position: static; grid-column: 2; justify-self: center; }
.try-nav button.pending-action { width: auto; height: auto; padding: 12px 20px; border-radius: 8px; font-size: 15px; background: var(--blue); color: white; }
.museum-intro { max-width: 100%; }
.souvenir-shell { min-height: 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); gap: 80px 60px; }
.souvenir-copy { min-width: 0; width: auto; }
.souvenir-hero { position: static; width: 100%; height: auto; align-self: start; aspect-ratio: 594 / 857; }
.souvenir-benefits { position: static; grid-column: 1 / -1; gap: 50px; }
.souvenir-order { position: static; grid-column: 1 / -1; justify-self: center; transform: none; margin: 0; }
.contact-card > *, .footer-contact { min-width: 0; overflow-wrap: anywhere; }
.action-dialog { color: white; background: #171719; border: 1px solid #555; border-radius: 20px; width: min(660px,calc(100% - 32px)); max-height: calc(100dvh - 40px); padding: 0; overflow: auto; }
.action-dialog::backdrop { background: rgba(0,0,0,.8); }
.dialog-shell { position: relative; padding: 48px 32px 32px; }
.dialog-close { position: absolute; top: 8px; right: 8px; border: 0; background: none; color: white; width: 40px; height: 40px; cursor: pointer; font-size: 30px; }
.dialog-shell h2 { margin: 0; font-size: 28px; font-weight: 500; }
.dialog-shell p { color: var(--muted); font-size: 16px; line-height: 1.6; }
.dialog-contact { display: inline-block; padding: 13px 20px; background: var(--blue); border-radius: 8px; margin-top: 14px; }
.dialog-video { display: block; width: 100%; max-height: 55dvh; background: black; }
.noscript-note { padding: 24px; margin: 0; background: #171719; color: white; }
@media (min-width: 1101px) and (max-width: 1500px) {
  .site-header { padding-inline: clamp(30px,9.2vw,135px); }
  .desktop-nav { gap: 24px; }
  .desktop-nav a { font-size: 15px; }
  .desktop-actions { gap: 24px; margin-left: 32px; }
  .header-cta { width: 180px; font-size: 15px; }
  .how-panel { padding: 70px 40px; gap: 60px 24px; }
  .how-intro h2 { font-size: 46px; }
  .how-choice > h3 { font-size: 34px; }
  .how-visual { min-height: 750px; }
  .how-card { padding: 24px; }
}
@media (min-width: 769px) and (max-width: 1100px) {
  .desktop-nav, .desktop-actions { display: none; }
  .mobile-languages { display: flex; position: absolute; right: 94px; top: 35px; align-items: center; gap: 10px; }
  .mobile-languages button { padding: 0; border: 0; background: none; color: var(--muted); font-size: 13px; }
  .mobile-languages span { height: 13px; width: 1px; background: #666; }
  .mobile-languages button.active { color: white; }
  .menu-button { display: block; position: absolute; right: 30px; top: 23px; width: 40px; height: 40px; padding: 0; border: 0; background: transparent; }
  .menu-button span { position: absolute; height: 2px; width: 22px; left: 9px; background: #fff; }
  .menu-button span:first-child { top: 14px; }
  .menu-button span:last-child { top: 24px; }
  .menu-button.open span:first-child { top: 19px; transform: rotate(45deg); }
  .menu-button.open span:last-child { top: 19px; transform: rotate(-45deg); }
  .mobile-menu.open { display: flex; position: absolute; z-index: 19; top: 82px; left: 0; right: 0; padding: 28px 30px; background: #000; flex-direction: column; gap: 24px; }
  .mobile-menu .primary-button { width: min(351px,100%); }
  .hero-content { max-width: calc(100% - 60px); }
  .features-inner { width: calc(100% - 60px); }
  .how-panel { min-height: 0; padding: 60px 36px; grid-template-areas: "intro visual" "choice choice"; gap: 50px 30px; }
  .how-visual { min-height: 430px; }
  .how-intro h2 { font-size: 42px; }
  .how-choice > h3 { font-size: 34px; }
  .try-panel { padding: 60px 36px; gap: 40px; }
  .try-copy h2 { font-size: 40px; }
  .benefit-grid { gap: 60px 40px; }
  .souvenir-shell { gap: 60px 36px; }
  .souvenir-copy h2 { font-size: 42px; }
  .tourist-script { font-size: 40px; }
  .special-edition { margin-left: 30px; }
  .souvenir-benefits { gap: 25px; }
  .contact-card { gap: 24px; padding: 28px; }
  .contact-card h3 { font-size: 23px; }
  .socials { gap: 20px; }
}
@media (max-width: 768px) {
  .site-header { display: block; padding: 0; }
  .brand { position: absolute; margin: 0; }
  .hero-video-mobile { width: 100%; height: 504px; object-fit: cover; }
  .learn-more-hit { width: 95px; height: 95px; }
  .motion-toggle { right: 30px; bottom: 116px; font-size: 11px; }
  .menu-button { width: 40px; height: 40px; top: 47px; right: 21px; }
  .menu-button span { left: 9px; }
  .menu-button span:first-child { top: 14px; }
  .menu-button span:last-child { top: 24px; }
  .menu-button.open span:first-child, .menu-button.open span:last-child { top: 19px; }
  .mobile-languages button { min-height: 28px; cursor: pointer; }
  .feature-card { min-height: 561px; height: auto; }
  .feature-card video { height: auto; aspect-ratio: 718 / 776; }
  .how-panel { width: 100%; padding: 80px 30px; min-height: 0; border-radius: 0; grid-template-columns: minmax(0,1fr); grid-template-areas: "intro" "visual" "choice"; gap: 50px; }
  .how-intro h2 { font-size: 33px; letter-spacing: -.4px; }
  .how-intro p { font-size: 15px; margin-top: 34px; }
  .how-choice > h3 { font-size: 31px; margin: 0 0 34px; }
  .how-visual { min-height: 430px; width: 100%; border-radius: 20px; }
  .how-card { min-height: 300px; }
  .how-card p { font-size: 15px; }
  .how-options { grid-template-columns: minmax(0,1fr); }
  .try-panel { width: 100%; padding: 68px 30px 40px; grid-template-columns: minmax(0,1fr); gap: 40px; }
  .try-copy h2 { font-size: 33px; }
  .try-copy p { margin-top: 34px; }
  .marker-demo { min-height: 220px; }
  .try-nav { grid-column: 1; }
  .souvenir-shell { display: flex; gap: 0; }
  .souvenir-benefits { margin-top: 64px; }
  .souvenir-order { margin-top: 60px; }
  .contact-card { padding: 30px 24px; }
}
@media (max-width: 359px) {
  .hero-content h1 { font-size: 29px; }
  .tag { font-size: 12px; padding-right: 10px; }
  .tag-architecture { white-space: normal; }
  .how-card { padding: 20px; }
  .features-section h2 { font-size: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Functional improvements only; the original layout remains in styles.css. */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.hero-tags { pointer-events:none; }
.feature-media { position:relative; flex:none; }
.feature-media video { display:block; }
.video-view-button { position:absolute; right:12px; bottom:12px; z-index:2; min-height:44px; padding:10px 14px; border:1px solid rgba(255,255,255,.45); border-radius:8px; background:rgba(0,0,0,.82); color:#fff; font-size:13px; font-weight:500; line-height:1.25; cursor:pointer; }
.video-view-button:hover { background:#000; }
.video-view-button:focus-visible { outline-offset:3px; }
.feature-track,.feature-extra,.object-track { -webkit-overflow-scrolling:touch; }
@media (hover:hover) and (pointer:fine) {
  .feature-track,.feature-extra,.object-track { cursor:grab; }
  .is-dragging,.is-dragging * { cursor:grabbing!important; user-select:none!important; }
}
.motion-toggle { min-height:44px; display:flex; align-items:center; }
.language-button { position:relative; }
.language-button::before { content:""; position:absolute; inset:-7px; }
.language-menu button { min-height:44px; }
.dialog-close { width:44px; height:44px; }
.dialog-links { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:20px; }
.dialog-contact { margin:0; min-height:44px; display:inline-flex; align-items:center; }
.dialog-secondary,.dialog-retry { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 14px; border:1px solid #767678; border-radius:8px; background:transparent; color:white; font-size:14px; cursor:pointer; }
.dialog-secondary:hover,.dialog-retry:hover { background:#303034; }
.dialog-shell .copy-address { user-select:text; margin:16px 0 0; color:#fff; overflow-wrap:anywhere; }
.dialog-shell .copy-status { min-height:24px; font-size:13px; line-height:1.45; margin-bottom:0; }
.dialog-shell .copy-status:empty { display:none; }
.dialog-shell .media-error { color:#ffcfad; margin:12px 0; }
.dialog-video { object-fit:contain; max-height:58dvh; }
.dialog-video:focus-visible { outline-offset:2px; }
.noscript-nav { padding:20px 30px; display:flex; flex-wrap:wrap; gap:20px; background:black; }
.noscript-nav a { text-decoration:underline; }
/* Optional how/AR replacements stay INSIDE their own visual containers.
   Object cards have a dedicated one-image binder in script.js. */
.how-visual,.marker-demo { isolation:isolate; }
.how-visual > .connected-asset,.marker-demo > .connected-asset {
  position:absolute; z-index:1; inset:0; width:100%; height:100%; object-fit:cover; opacity:0;
}
.marker-demo > .connected-asset { object-fit:contain; background:#fff; }
.how-visual.has-original > .connected-asset,.marker-demo.has-original > .connected-asset { opacity:1; }
.how-visual.has-original > :not(.connected-asset),.marker-demo.has-original > :not(.connected-asset) { visibility:hidden; }
.web-qr { display:block; max-width:100%; object-fit:contain; margin:auto auto 0; }
@media (max-width:768px) {
  /* Preserve icon graphics; only extend the physical touch areas. */
  .carousel-controls { height:44px; }
  .carousel-arrow,.object-controls button { width:44px; height:44px; font-size:20px; }
  .city-filters { flex-wrap:wrap; overflow:visible; }
  .city-filters button { min-height:44px; height:auto; padding:10px 18px; }
  .mobile-languages button { min-height:32px; min-width:28px; }
  .dialog-shell { padding:52px 24px 24px; }
  .dialog-shell h2 { font-size:25px; line-height:1.25; }
  .dialog-links > * { flex:1 1 100%; }
}
@media (prefers-reduced-motion:reduce) {
  .feature-track,.feature-extra,.object-track { scroll-behavior:auto; }
}
@media (forced-colors:active) {
  .video-view-button,.dialog-secondary,.dialog-retry,.motion-toggle { border:1px solid ButtonText; }
}
@media (max-width:768px) {
  /* Fits between the last CTA (ends at 1300px) and the round arrow (starts at 1353px). */
  .motion-toggle { bottom:96px; }
}

/* repair-4 — card stacking, captions and photo error states. */
.object-card {
  position:relative; isolation:isolate; height:auto; min-height:656px;
  min-width:0; flex-shrink:0;
}
.object-photo {
  position:relative; isolation:isolate; z-index:0; flex:0 0 auto;
  width:100%; height:auto; aspect-ratio:392 / 387; overflow:hidden; background:#222428;
}
.object-photo > .object-image {
  display:block; position:absolute; inset:0; z-index:0; width:100%; height:100%;
  object-fit:cover; object-position:center; user-select:none; -webkit-user-drag:none;
}
.object-photo::after {
  pointer-events:none; z-index:1; inset:0;
  background:linear-gradient(to bottom,transparent 48%,rgba(0,0,0,.35) 64%,rgba(0,0,0,.9) 80%,#000 87%);
}
.object-photo > .city-badge {
  z-index:2; top:3.2%; right:3.4%; min-width:112px; max-width:calc(100% - 32px);
  min-height:30px; padding:6px 18px; border-radius:999px; background:#f5f5f5;
  color:#222; font-size:13px; font-weight:500; line-height:18px; text-align:center;
  white-space:nowrap; pointer-events:none;
}
/* The solid badge is deliberately a little larger than the baked-in badge of
   the three old crops. It covers that badge instead of drawing beside it.
   The gradient reaches solid black before their rasterised bottom captions. */
.object-card > .object-title {
  position:relative; z-index:1; flex:0 0 auto; min-height:100px;
  margin:-36px 30px 0; color:#fff; visibility:visible; font-size:25px;
  line-height:1.32; font-weight:500; overflow-wrap:break-word;
}
.object-actions { position:relative; z-index:1; padding-top:28px; }
.object-actions a { min-height:44px; height:auto; padding:10px 12px; line-height:1.35; text-align:center; }
.object-photo-status {
  position:absolute; z-index:3; inset:28% 20px auto; padding:16px; border-radius:12px;
  background:#141518; color:#e9e9eb; text-align:center; font-size:14px; line-height:1.4;
}
.object-photo-status p { margin:0 0 12px; }
.object-photo-retry { background:transparent; color:#fff; border:1px solid #79797e; border-radius:8px; min-height:44px; padding:10px 16px; cursor:pointer; }
.object-photo[data-image-state="error"] { background:#24262b; }
.object-photo-status[hidden] { display:none!important; }
.city-filters button:focus-visible { outline-offset:4px; }
.city-filters button[aria-pressed="true"] { box-shadow:inset 0 0 0 1px #626267; }
@media (max-width:768px) {
  .object-card { min-height:560px; height:auto; }
  .object-card > .object-title { margin:-28px 20px 0; min-height:112px; font-size:21px; }
  .object-photo > .city-badge { min-width:108px; padding:5px 14px; font-size:12px; line-height:18px; min-height:28px; }
  .object-actions { padding:24px 20px 0; }
}

/* Invisible until keyboard focus, including long-page captures / print layouts. */
.skip-link { top:12px; transform:translateY(calc(-100% - 20px)); opacity:0; pointer-events:none; }
.skip-link:focus { top:12px; transform:none; opacity:1; pointer-events:auto; }

/* links-5: no fake tour links, one concise non-interactive empty state. */
.object-materials-note {
  margin:0; padding:10px 0; color:#b6b6bb; font-size:14px; line-height:1.5;
}
.object-actions [hidden], .socials [hidden] { display:none!important; }
.socials a { min-width:44px; min-height:44px; flex-shrink:0; }
.socials a:focus-visible { outline:2px solid #1977f3; outline-offset:6px; }
@media (max-width:768px) {
  /* Keep the footer divider/copyright in normal flow, below wrapped contacts. */
  .footer-inner { min-height:0; }
  .footer-contact { min-width:0; overflow-wrap:anywhere; line-height:1.5; }
  .footer-line { position:static; width:100%; grid-column:1; margin:0; }
  .copyright { position:static; transform:none; justify-self:center; grid-column:1; }
}

/* Review 6: source-based geometry. Reference canvas: 1920, inner width: 1440.
 * Only previously available artwork is used. Remaining original SVG/image slots
 * are listed in REVIEW-16.md; these rules do not claim a completed 1:1 match. */
:root { --layout-width:1440px; --edge:max(30px,calc((100vw - var(--layout-width))/2)); }
body { font-family:'Onest',Arial,sans-serif; }
html,body { overflow-x:clip; }
.features-inner,.section-shell,.footer-inner { width:min(var(--layout-width),calc(100% - 60px)); margin-inline:auto; }
h1,h2,h3,h4,p { text-wrap:initial; }
.header-cta { font-family:'Golos Text','Onest',Arial,sans-serif; }
/* The hero's existing layout and original SVG dimensions are retained. */
.motion-toggle,.video-view-button { display:none!important; }
.features-section { min-height:0; margin-top:-69px; padding:139px 0 150px; overflow:clip; }
.hero { z-index:1; }
.features-section h2 { margin:0 0 60px; font-size:55px; line-height:70px; font-weight:600; letter-spacing:0; }
.feature-carousel,.object-carousel { width:calc(100% + var(--edge)); }
.feature-track,.object-track { width:100%; overflow-x:auto; scroll-padding-left:0; padding:0; gap:12px; scrollbar-width:none; }
.feature-track::-webkit-scrollbar,.object-track::-webkit-scrollbar { display:none; }
.feature-card { flex:0 0 351px; min-height:656px; height:auto; border:0; border-radius:25px; background:#fff; color:#000; display:flex; flex-direction:column; }
.feature-media { height:378px; flex:none; }
.feature-media video { width:100%; height:100%; aspect-ratio:auto; object-fit:cover; background:#eee; }
.feature-body { padding:3px 30px 30px; }
.feature-body h3 { margin:0; padding:0; transform:none; min-height:26px; font-size:21px; line-height:26px; font-weight:600; color:#000; }
.feature-body p { margin:25px 0 0; font-size:19px; line-height:24px; font-weight:500; color:#515151; }
.features-section .features-subtitle { margin:88px 0 60px!important; font-size:40px!important; line-height:51px!important; font-weight:600; letter-spacing:0; }
.feature-extra { gap:12px; padding:0; overflow-x:auto; scrollbar-width:none; }
.feature-extra .feature-card { flex-basis:351px; }
.feature-extra .feature-body { padding-top:4px; }
.feature-extra .feature-body h3 { min-height:59px; font-size:23px; line-height:29.5px; }
/* Discrete dots and active dash replace both old progress indicators. */
.carousel-controls,.object-controls { width:min(331px,100%); height:33px; margin:48px 0 0; margin-left:calc((100% - var(--edge) - min(331px,100%))/2); display:flex; justify-content:center; align-items:center; gap:18px; }
.carousel-controls { margin-left:auto; margin-right:auto; }
.carousel-arrow,.object-controls button:not(.step-dot) { display:grid; place-items:center; flex:0 0 33px; width:33px; height:33px; min-width:33px; min-height:33px; margin:0; padding:0; border:0; border-radius:50%; background:#fff; color:#242424; cursor:pointer; }
.carousel-arrow:disabled,.object-controls button:not(.step-dot):disabled { visibility:hidden; opacity:0; pointer-events:none; }
.step-dots { display:flex; align-items:center; justify-content:center; gap:11px; }
.step-dot { display:grid; place-items:center; flex:none; width:9px; height:33px; min-width:0; min-height:0; padding:0; border:0; background:transparent; cursor:pointer; }
.step-dot span { display:block; width:9px; height:9px; border-radius:99px; background:#3b3b3d; transition:width .2s ease,background .2s ease; }
.step-dot.is-active { width:30px; }
.step-dot.is-active span { width:30px; background:#fff; }
.chevron { width:9px; height:9px; border-top:2px solid currentColor; border-right:2px solid currentColor; transform:translateX(-2px) rotate(45deg); }
.chevron.left { transform:translateX(2px) rotate(-135deg); }
.carousel-progress,.object-counter { display:none; }
/* How it works: exact known 1703x1202 desktop panel and 351x351 cards. */
.how-panel { width:min(1703px,calc(100% - 60px)); min-height:1202px; height:auto; padding:100px 130px; border-radius:50px; grid-template-columns:minmax(0,714fr) minmax(0,717fr); grid-template-rows:420px minmax(462px,auto); grid-template-areas:'intro visual' 'choice visual'; gap:120px 12px; }
.how-intro { position:relative; }
.how-intro h2 { font-size:55px; line-height:70px; font-weight:600; letter-spacing:0; }
.how-intro p { width:min(593px,100%); font-size:19px; line-height:24px; font-weight:500; margin:60px 0 0; }
.how-intro .how-note { margin-top:24px; }
.how-play { position:absolute; left:0; top:345px; margin:0; width:75px; height:75px; }
.how-choice { align-self:start; }
.how-choice > h3 { font-size:40px; line-height:51px; font-weight:600; margin:0 0 60px; letter-spacing:0; }
.how-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.how-card { min-height:351px; padding:30px; border-radius:25px; }
.how-card h4 { font-size:26px; line-height:33px; font-weight:600; }
.how-card p { margin:30px 0 26px; font-size:19px; line-height:24px; font-weight:500; }
.store-buttons { margin-top:auto; gap:10px; }
.store-button { min-height:50px; height:50px; border-radius:9px; }
.how-visual { min-height:1002px; height:100%; border-radius:25px; }
.qr-decoration { position:relative; margin:auto auto 0; width:121px; height:64px; flex:none; color:#999; font-size:12px; display:grid; place-items:center; }
.qr-decoration.has-artwork { color:transparent; }
.qr-decoration img { width:64px; height:64px; object-fit:contain; }
.qr-scan-line { position:absolute; left:0; right:0; top:0; height:3px; background:linear-gradient(90deg,transparent,#1977f3 40%,#1977f3 60%,transparent); animation:qr-scan 2.6s ease-in-out infinite alternate; }
@keyframes qr-scan { to { transform:translateY(61px); } }
/* Object labels and photos remain independent, with the v4 stacking fix retained. */
.objects-section { padding:150px 0; }
.objects-section h2 { font-size:55px; line-height:70px; font-weight:600; max-width:1077px; letter-spacing:0; }
.section-lead { font-size:19px; line-height:24px; }
.city-filters button { font-size:17px; font-weight:500; }
.object-card { flex:0 0 351px; min-height:711px; height:auto; padding-bottom:30px; border-radius:25px; }
.object-photo { aspect-ratio:351 / 346; min-height:0; height:auto; }
.object-card > .object-title { margin:30px 30px 0; min-height:132px; font-size:26px; line-height:33px; font-weight:600; }
.object-photo > .city-badge { min-width:0; min-height:23px; top:15px; right:15px; padding:5px 22px; font-size:12px; line-height:13px; font-weight:500; background:#fff; }
.object-photo[data-legacy-caption='true'] > .city-badge { min-width:112px; min-height:30px; top:3.2%; right:3.4%; padding:6px 18px; }
.object-actions { margin-top:auto; padding:28px 30px 0; gap:10px; }
.object-actions a { min-height:40px; height:40px; padding:8px 10px; font-size:19px; line-height:24px; border-radius:9px; }
.object-materials-note { font-size:15px; line-height:22px; }
/* Try section: left text/CTA and 956x717 image area, not the old centered grid. */
.try-panel { width:min(1703px,calc(100% - 60px)); min-height:897px; padding:90px 130px; border-radius:50px; grid-template-columns:minmax(0,472fr) minmax(0,956fr); grid-template-areas:'copy picture'; gap:12px; }
.try-copy { grid-area:copy; padding-top:10px; }
.try-copy h2 { max-width:472px; font-size:55px; line-height:70px; font-weight:600; letter-spacing:0; margin:0; }
.try-copy p { max-width:352px; font-size:19px; line-height:25px; margin:60px 0 0; }
.marker-demo { grid-area:picture; min-height:0; width:100%; aspect-ratio:956 / 717; border-radius:0; }
.try-nav { grid-area:copy; align-self:end; justify-self:start; margin:0; padding:0; }
.try-nav button.pending-action { width:min(351px,100%); height:50px; min-height:50px; padding:10px 20px; border-radius:9px; font-size:19px; line-height:24px; }
/* Match the known postcard layout while waiting for its unreleased source vectors. */
.souvenir-section { padding:150px 0; }
.souvenir-shell { display:grid; grid-template-columns:minmax(0,593fr) minmax(0,714fr); column-gap:133px; row-gap:0; }
.souvenir-copy { grid-column:1; width:auto; min-width:0; }
.tourist-script { min-height:71px; margin:0; }
.special-edition { width:288px; min-height:44px; margin:49px auto 0; }
.souvenir-copy h2 { width:auto; max-width:590px; min-height:140px; font-size:55px; line-height:70px; font-weight:600; margin:80px 0 0; letter-spacing:0; }
.souvenir-copy > p { width:auto; max-width:590px; min-height:116px; font-size:19px; line-height:24px; font-weight:500; margin:60px 0 0; }
.souvenir-play { width:75px; height:75px; margin:60px 0 0; }
.souvenir-mini { display:block; margin:62px 0 0; }
/* Postcard sequence artwork and timing will be wired after the original states are supplied. */
.souvenir-hero { grid-column:2; width:100%; height:auto; aspect-ratio:714 / 1031; border-radius:25px; }
.souvenir-benefits { grid-column:1 / -1; margin:148px 0 0; gap:60px; }
.souvenir-benefits h3 { font-size:24px; line-height:31px; font-weight:600; }
.souvenir-benefits p { font-size:19px; line-height:24px; font-weight:500; }
.souvenir-order { grid-column:1 / -1; width:min(472px,100%); height:50px; margin:100px 0 0; padding:0; justify-self:center; font-size:19px; }
.museum-section h2,.contact-section h2 { font-size:55px; line-height:70px; font-weight:600; letter-spacing:0; }
.museum-intro { font-size:19px; line-height:24px; font-weight:500; }
.benefit-grid h3 { font-size:26px; line-height:33px; font-weight:600; }
.benefit-grid p { font-size:19px; line-height:24px; font-weight:500; }
.contact-card h3 { font-size:21px; line-height:26px; font-weight:600; }
.contact-card p { font-size:19px; line-height:29px; font-weight:500; }
.copyright { font-size:16px; line-height:25px; text-align:center; white-space:normal; }
.footer-inner { min-height:240px; }
.footer-line { bottom:75px; }
.socials a { width:40px; height:40px; min-width:40px; min-height:40px; }
.dialog-image { display:block; max-width:100%; width:auto; height:auto; max-height:70dvh; margin:20px auto 0; object-fit:contain; }
.about-pending { min-height:100vh; background:#000; display:flex; flex-direction:column; padding:30px; }
.about-pending header,.about-pending main,.about-pending footer { width:min(1440px,100%); margin-inline:auto; }
.about-pending main { flex:1; padding:100px 0; }
.about-pending h1 { font-size:55px; font-weight:600; }
.about-pending p { font-size:19px; color:#c4c4c4; }
.about-pending .primary-button { display:grid; place-items:center; margin-top:40px; }
@media (min-width:769px) and (max-width:1599px) {
  :root { --layout-width:1200px; }
  .features-section h2,.objects-section h2,.museum-section h2,.contact-section h2 { font-size:45px; line-height:57px; }
  .features-inner,.section-shell,.footer-inner { width:min(1200px,calc(100% - 60px)); }
  .feature-card,.feature-extra .feature-card { flex-basis:392px; min-height:684px; }
  .feature-media { height:422px; }
  .object-card { flex-basis:392px; }
  .how-panel { min-height:0; padding:80px 40px; grid-template-rows:auto auto; gap:90px 24px; }
  .how-intro h2 { font-size:45px; line-height:57px; }
  .how-intro p { margin-top:40px; }
  .how-intro .how-note { margin-top:24px; }
  .how-intro { padding-bottom:135px; }
  .how-play { top:auto; bottom:0; }
  .how-choice > h3 { font-size:36px; line-height:46px; margin-bottom:40px; }
  .how-card { min-height:351px; padding:25px; }
  .how-card h4 { font-size:23px; }
  .how-card p { font-size:17px; line-height:23px; }
  .how-visual { min-height:800px; }
  .try-panel { min-height:0; padding:80px 40px; gap:32px; }
  .try-copy { padding-bottom:100px; }
  .try-copy h2 { font-size:45px; line-height:57px; }
  .try-copy p { margin-top:40px; }
  .souvenir-shell { column-gap:80px; }
  .souvenir-copy h2 { font-size:45px; line-height:57px; min-height:114px; }
  .souvenir-benefits { gap:30px; }
}
@media (min-width:769px) and (max-width:1100px) {
  .how-panel { grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-areas:'intro visual' 'choice choice'; gap:60px 30px; padding:60px 36px; }
  .how-visual { min-height:0; }
  .how-choice > h3 { margin-bottom:40px; }
  .try-panel { padding:60px 36px; grid-template-columns:minmax(0,1fr); grid-template-areas:'copy' 'picture' 'cta'; gap:40px; }
  .try-copy { padding-bottom:0; }
  .try-nav { grid-area:cta; }
  .souvenir-shell { column-gap:36px; }
  .souvenir-benefits { grid-template-columns:1fr; gap:40px; margin-top:80px; }
  .special-edition { width:min(288px,100%); }
}
@media (max-width:768px) {
  :root { --layout-width:100vw; --edge:30px; }
  .hero { height:1448px; }
  .features-section { margin-top:-36px; padding:92px 0 99px; }
  .features-inner { width:100%; }
  .features-section h2 { margin:0 30px 36px; font-size:33px; line-height:42px; font-weight:600; }
  .feature-carousel,.object-carousel { width:100%; }
  .feature-track { padding:0 30px; scroll-padding-left:30px; }
  .feature-card,.feature-extra .feature-card { flex-basis:300px; min-height:561px; border-radius:20px; }
  .feature-media { height:324px; }
  .feature-body { padding:3px 25px 25px; }
  .feature-body h3 { font-size:19px; line-height:25px; }
  .feature-body p { font-size:15px; line-height:20px; margin-top:20px; }
  .feature-extra .feature-body h3 { font-size:21px; line-height:27px; min-height:54px; }
  .feature-extra { padding:0 30px; scroll-padding-left:30px; }
  .features-section .features-subtitle { font-size:24px!important; line-height:30px!important; margin:80px 30px 26px!important; }
  .carousel-controls,.object-controls { height:9px; margin:20px auto 0; width:100%; }
  .carousel-arrow,.object-controls button:not(.step-dot) { display:none; }
  .step-dots { max-width:calc(100% - 60px); gap:11px; }
  .step-dot { height:33px; }
  .how-panel { width:100%; min-height:0; padding:90px 30px; border-radius:0; grid-template-columns:1fr; grid-template-rows:auto; grid-template-areas:'intro' 'visual' 'choice'; gap:60px; }
  .how-intro { padding-bottom:100px; }
  .how-intro h2 { font-size:33px; line-height:42px; }
  .how-intro p { font-size:15px; line-height:20px; font-weight:500; margin-top:34px; }
  .how-intro .how-note { margin-top:20px; }
  .how-play { top:auto; bottom:0; width:64px; height:64px; }
  .how-choice > h3 { font-size:25px; line-height:32px; margin-bottom:34px; }
  .how-options { grid-template-columns:1fr; }
  .how-card { min-height:300px; padding:25px; }
  .how-card h4 { font-size:23px; line-height:30px; }
  .how-card p { margin-top:25px; font-size:15px; line-height:20px; }
  .how-visual { height:auto; min-height:430px; border-radius:20px; }
  .section-shell,.footer-inner { width:calc(100% - 60px); }
  .objects-section { padding:90px 0; }
  .objects-section h2,.museum-section h2,.contact-section h2 { font-size:33px; line-height:42px; font-weight:600; }
  .objects-section .section-lead { font-size:15px; line-height:20px; }
  .object-carousel { width:calc(100% + 30px); }
  .object-track { padding-right:30px; scroll-padding-left:0; }
  .object-card { flex-basis:300px; max-width:none; min-height:630px; border-radius:20px; }
  .object-card > .object-title { font-size:21px; line-height:27px; margin:25px 25px 0; min-height:108px; }
  .object-actions { padding:25px 25px 0; }
  .object-actions a { font-size:15px; line-height:20px; }
  .object-photo > .city-badge { font-size:11px; padding:5px 16px; }
  .object-photo[data-legacy-caption='true'] > .city-badge { min-width:104px; }
  .city-filters { margin-bottom:40px; gap:10px; }
  .city-filters button { font-size:14px; }
  .try-panel { width:100%; padding:70px 30px; min-height:0; border-radius:0; grid-template-columns:1fr; grid-template-areas:'copy' 'picture' 'cta'; gap:40px; }
  .try-copy { padding:0; }
  .try-copy h2 { font-size:33px; line-height:42px; }
  .try-copy p { font-size:15px; line-height:20px; margin-top:34px; }
  .try-nav { grid-area:cta; width:100%; }
  .try-nav button.pending-action { width:100%; height:40px; min-height:40px; font-size:15px; }
  .souvenir-section { padding:80px 0; }
  .souvenir-shell { display:flex; flex-direction:column; gap:0; }
  .tourist-script { min-height:0; }
  .special-edition { width:min(288px,100%); margin:30px auto 0; min-height:0; }
  .souvenir-copy h2 { min-height:0; font-size:33px; line-height:42px; margin:50px 0 0; }
  .souvenir-copy > p { min-height:0; font-size:15px; line-height:20px; margin:34px 0 0; }
  .souvenir-play { width:64px; height:64px; margin-top:35px; }
  .souvenir-mini,.postcard-stage { margin-top:40px; }
  .souvenir-hero { margin-top:50px; border-radius:20px; }
  .souvenir-benefits { margin-top:65px; gap:40px; }
  .souvenir-benefits h3 { font-size:21px; line-height:27px; }
  .souvenir-benefits p { font-size:15px; line-height:20px; }
  .souvenir-order { margin-top:60px; width:100%; height:40px; font-size:15px; }
  .museum-intro { font-size:15px; line-height:20px; }
  .benefit-grid h3 { font-size:21px; line-height:27px; }
  .benefit-grid p { font-size:15px; line-height:20px; }
  .contact-card h3 { font-size:21px; line-height:27px; }
  .contact-card p { font-size:15px; line-height:22px; }
  .footer-inner { min-height:0; }
  .footer-line { position:static; }
  .copyright { position:static; transform:none; font-size:14px; line-height:24px; }
  .about-pending h1 { font-size:33px; }
}
@media (max-width:359px) {
  .feature-card,.feature-extra .feature-card,.object-card { flex-basis:calc(100vw - 60px); }
  .feature-media { height:auto; aspect-ratio:718 / 776; }
  .feature-media video { height:100%; }
  .features-section h2,.objects-section h2,.how-intro h2,.try-copy h2 { font-size:29px; line-height:38px; }
}
/* Maintain the controls' alignment with the content, not the extended rail. */
.carousel-controls,.object-controls { width:331px; max-width:calc(100% - var(--edge)); margin-left:calc((100% - var(--edge) - 331px)/2); margin-right:0; }
.extra-controls { display:none; }
.dialog-image { display:block; width:100%; height:auto; max-height:75dvh; object-fit:contain; }
.image-dialog { width:min(1120px,calc(100% - 32px)); }
@media(max-width:768px) {
 .carousel-controls { max-width:none; width:100%; margin:20px auto 0; }
 .object-controls { max-width:none; width:calc(100% - 30px); margin:20px 30px 0 0; }
 .extra-controls { display:flex; justify-content:center; height:9px; margin:20px auto 0; }
 .extra-prev,.extra-next { display:none; }
}
/* Decorative QR uses a non-paragraph wrapper so card text margins cannot enlarge it. */
.how-card .qr-decoration { margin:auto auto 0; }
/* Clear inherited fixed widths that used to wrap desktop headings too early. */
.objects-section h2 { width:min(1077px,100%); }
.try-section { padding:0; }
.try-nav { width:min(351px,100%); }
.try-nav button.pending-action { width:100%; }
@media(min-width:1600px) {
 .try-panel { padding-right:133px; }
 .museum-section { padding:150px 0; }
 .museum-shell > h2 { width:834px; max-width:100%; }
 .museum-intro { width:834px; margin:60px 0 117px; }
 .museum-collage { height:456px; }
 .benefit-grid { grid-template-columns:repeat(3,minmax(0,1fr)); column-gap:12px; row-gap:123px; margin-top:157px; }
 .benefit-grid article { min-height:0; }
 .benefit-grid h3,.benefit-grid p { max-width:366px; }
 .benefit-grid p { margin-top:30px; }
 .museum-shell > .wide-button { width:472px; margin-top:100px; }
 .contact-section { padding:150px 0; }
 .contact-card { margin-top:60px; }
}
.design-artwork { display:block; max-width:100%; height:auto; }
.tourist-script.has-artwork,.special-edition.has-artwork { padding:0; background:none; transform:none; }
.special-edition.has-artwork { display:block; }
.how-play.has-artwork,.souvenir-play.has-artwork { padding:0; background:none; }
.store-button.has-artwork { padding:0; }
@media(prefers-reduced-motion:reduce) { .qr-scan-line { animation:none; } }

/* release 7 — original .fig geometry and graphics, not screenshots of sections.
   Design anchors: desktop 1920 (inner grid 1440), mobile 360 (inner grid 300).
   Intermediate widths reflow; text and controls remain live HTML. */
[hidden] { display:none!important; }
:root { --surface:#1d1d1f; }
.original-svg { display:block; max-width:none; flex:none; }
.fig-photo { position:relative; overflow:hidden; }
.fig-photo > img, .fig-photo > img.object-image {
 position:absolute; display:block; left:var(--ix,0%); top:var(--iy,0%); right:auto; bottom:auto;
 width:var(--iw,100%); height:var(--ih,100%); max-width:none; object-fit:fill;
}
.svg-frame,.desktop-wordmark,.mobile-wordmark { display:block; position:relative; overflow:visible; }
.svg-frame > img,.desktop-wordmark > img,.mobile-wordmark > img,.store-button > img,.original-play > img { position:absolute; top:0; left:0; transform-origin:0 0; }
.mobile-wordmark { display:none; }
@media(min-width:1600px) {
 .desktop-nav { left:calc((100vw - 1440px)/2 + 494px); transform:none; }
 .hero-content h1 { width:1066px; top:524px; font-size:65px; line-height:1.36; letter-spacing:0; }
 .hero-copy { top:744px; }
}
/* Carousels use the original 33px arrow SVGs, with an invisible 44px touch target. */
.step-controls button:not(.step-dot),.carousel-arrow,.object-controls button:not(.step-dot),.extra-prev,.extra-next { position:relative; border:0; background:none; padding:0; }
.step-controls button:not(.step-dot)::before,.carousel-arrow::before,.object-controls button:not(.step-dot)::before { content:'';position:absolute;inset:-5.5px; }
.step-controls button:disabled,.carousel-arrow:disabled { visibility:hidden; pointer-events:none; }
.feature-card { height:656px; min-height:656px; }
.feature-extra .feature-body h3 { font-size:23px; }
.feature-extra .feature-body p { margin-top:25px; }
/* How: complete original assets; the QR is decoration only. */
.how-section { padding:0; }
.how-panel { background:#000; }
.how-visual { grid-area:visual; position:relative; background:transparent; }
.how-visual::before,.how-visual::after { content:none; }
.how-play,.souvenir-play { position:relative; background:none; padding:0; border:0; flex:none; }
.how-play { position:absolute; }
.how-play span,.souvenir-play span { display:none; }
.how-card { display:flex;flex-direction:column; }
.how-card h4 { margin:0; }
.how-card p { color:#515151; }
.store-button { display:block; position:relative; width:100%; min-height:0; padding:0; overflow:hidden; background:#000; }
.store-button::before,.store-button::after { content:none; }
.qr-decoration { margin:auto auto 0; width:120.889px; height:64px; }
.qr-decoration img { display:block; width:64px; height:64px; }
.qr-scan-line { animation:none; top:29.63px; height:3.55px; transform:none; }
/* Exact source photos replace the raster card crops with baked-in labels. */
.objects-section .section-lead:not([hidden]) { margin-top:60px; }
.objects-section .object-carousel { margin-top:100px; }
.object-card { display:flex;flex-direction:column;min-height:711px;height:711px;padding-bottom:29px; }
.object-card .object-photo { width:100%; aspect-ratio:351/346; flex:none; height:auto; background:#000; }
.object-photo::after { content:none; }
.object-photo > .city-badge { top:15px;right:15px;min-height:23px;padding:5px 22px;background:#fff;color:#515151;font:500 12px/13px Onest,Arial,sans-serif; }
.object-card > .object-title { margin:30px 30px 0; min-height:132px; height:auto; font:600 26px/33px Onest,Arial,sans-serif; color:#fff; }
.object-card .object-actions { display:grid;grid-template-rows:40px 40px 36px;gap:10px;flex:0 0 auto;margin-top:0;padding:28px 30px 0; }
.object-actions a[data-object-action=tour] { grid-row:1; }
.object-actions a[data-object-action=ar] { grid-row:2; }
.object-actions a.object-map { grid-row:3;margin-top:10px;justify-self:center;display:flex;gap:10px;align-items:center;justify-content:center;background:transparent;border:0;border-radius:0;height:36px;min-height:0;padding:0; font:500 12px/18px Onest,Arial,sans-serif; }
.object-map img { width:15px;height:22px; }
.object-map span { white-space:nowrap; }
.object-actions a { min-width:0; }
.object-actions a:hover { filter:brightness(1.12); }
.city-filters[hidden] { display:none!important; }
/* Try: exact original globe artwork, functional desktop enlarge control. */
.try-panel { background:#000; }
.marker-demo { position:relative;overflow:hidden;background:none;border:0; }
.marker-demo::before,.marker-demo::after { content:none; }
.mobile-try-note { display:none; }
/* Museums: same source collage and real 30px vector icons. */
.benefit-icon { position:absolute;top:0;left:0;width:30px;height:30px; }
.benefit-grid article,.souvenir-benefits article { position:relative;padding-left:60px; }
.museum-collage { display:block;object-fit:contain; }
/* Postcards: text and illustration share the source's asymmetric two-column layout. */
.tourist-script { width:590px;max-width:100%;height:auto;min-height:0;aspect-ratio:590/71; background:none;transform:none; }
.desktop-wordmark { width:100%; height:100%; }
.special-edition { width:288px; height:44px;min-height:0;padding:0;letter-spacing:0;background:none; }
.souvenir-copy .tourist-script img { filter:none; }
.souvenir-art { grid-column:2;grid-row:1; width:100%; aspect-ratio:714/1031; overflow:hidden;border-radius:25px; }
.souvenir-art-desktop { width:100%;height:100%; }
.souvenir-art-mobile { display:none; }
.souvenir-play { margin-top:60px; }
.postcard-stage { position:relative;width:100%;aspect-ratio:593/292;margin-top:62px; }
.postcard-canvas { position:absolute;left:0;top:0;transform-origin:0 0; }
.postcards-desktop { width:593px;height:292px; }
.postcards-mobile { display:none; width:408.50534px;height:201.03891px; }
.postcard-canvas > img { position:absolute;left:0;top:0;max-width:none;transform-origin:0 0;will-change:transform,opacity; }
.souvenir-benefits { grid-template-columns:repeat(3,minmax(0,1fr));column-gap:60px;row-gap:40px; }
.souvenir-benefits h3 { margin:0;font-size:24px;line-height:31px; }
.souvenir-benefits p { margin:30px 0 0; }
/* Contact and footer are shared verbatim across both pages. */
.contact-card { min-height:205px;padding:35px 40px 40px;display:grid;grid-template-columns:525fr 323fr 432fr;column-gap:40px; }
.contact-card > div:first-child { padding-top:5px; }
.contact-card h3 { margin:0;font-size:26px;line-height:26px; }
.contact-card p { margin:37px 0 0; }
.contact-method { display:flex;flex-direction:column;align-items:flex-start; }
.contact-method > span { display:grid;place-items:center;width:42px;height:42px;background:#1977f3;border-radius:9px;flex:none; }
.contact-method p { margin:30px 0 0; }
.contact-card strong { font-weight:600; }
.site-footer { padding:0; }
.footer-inner { display:grid;grid-template-columns:1fr 230px 1fr;grid-template-rows:auto 1px auto;column-gap:40px;align-items:start; min-height:299px; padding:60px 0 24px; }
.footer-logo { position:static;grid-column:1;grid-row:1;transform:none;margin:0;width:131px;height:44px; }
.socials { position:static;grid-column:2;grid-row:1;transform:none;margin:2px 0 0;width:230px;display:flex;justify-content:space-between;gap:0; }
.socials a { display:block;position:relative;width:40px;height:40px;min-width:40px;min-height:40px;border:0;border-radius:0;background:none;color:inherit;padding:0; }
.socials a::before { content:'';position:absolute;inset:-5px; }
.socials a img { width:40px;height:40px; }
.footer-contact { position:static;grid-column:3;grid-row:1;justify-self:end;transform:none;margin:12px 0 0;max-width:100%; }
.footer-contact p,.footer-contact > a { display:flex;gap:13px;align-items:flex-start;margin:0 0 11px;font:400 16px/30px Onest,Arial,sans-serif; }
.footer-contact p img { margin-top:3px; }
.footer-contact > a img { margin-top:8px; }
.footer-contact p::before { content:none; }
.footer-line { position:static;grid-column:1/-1;grid-row:2;width:100%;height:1px;background:#333;margin:50px 0 0; }
.copyright { position:static;grid-column:1/-1;grid-row:3;margin:75px 0 0;transform:none;font:400 14px/22px Onest,Arial,sans-serif;color:#b2b2b2; }
/* About — all copy, numbers and partner graphics come from the supplied .fig. */
.about-page .site-header { height:82px; }
.about-page .mobile-menu { top:82px;z-index:40; }
.about-intro { background:#000;padding:150px 0;min-height:871px; }
.about-intro-grid { display:grid;grid-template-columns:minmax(0,593px) minmax(0,714px);gap:133px; }
.about-copy h1 { font:600 55px/70px Onest,Arial,sans-serif;margin:0 0 52px; }
.about-text { max-width:589px;color:#c4c4c4;font:500 19px/24px Onest,Arial,sans-serif; }
.about-text p { margin:0 0 24px; }
.about-text p:last-child { margin:0; }
.about-gallery { padding-top:14px;min-width:0; }
.about-track { display:flex;gap:24px;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch; }
.about-track::-webkit-scrollbar { display:none; }
.about-slide { flex:0 0 100%;aspect-ratio:714/476;border-radius:25px;scroll-snap-align:start; }
.about-controls { width:331px;max-width:100%;height:33px;margin:48px auto 0;display:flex;align-items:center;justify-content:center;gap:18px; }
.about-controls button:not(.step-dot) { width:33px;height:33px; }
.about-stats { padding:140px 0; }
.about-stats h2,.about-partners h2 { margin:0;font:600 55px/70px Onest,Arial,sans-serif; }
.stats-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 14px;margin-top:100px; }
.stat-card { padding:30px;min-height:200px;border-radius:20px;background:#000; }
.stat-card h3 { margin:0;font:600 40px/51px Onest,Arial,sans-serif;white-space:nowrap; }
.stat-card p { margin:30px 0 0;font:500 19px/24px Onest,Arial,sans-serif;color:#c4c4c4;max-width:405px; }
.about-partners { padding:140px 0;min-height:558px;background:#000; }
.partner-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start;margin-top:110px; }
.partner-first { width:346px;max-width:100%;height:82px;margin-top:16px; }
.partner-third { width:232px;max-width:100%;height:85px; }
.partner-samarkand { position:relative;width:349.279px;height:86.51px;max-width:100%;margin-top:11px; }
.partner-emblem { position:absolute;width:74.636px;height:86.51px;left:0;top:0; }
.partner-samarkand > .original-svg { position:absolute;left:94.1px;top:32.4px; }
/* Intermediate screen widths: same typeface and graphic proportions, natural text reflow. */
@media(min-width:769px) and (max-width:1599px) {
 .feature-card { height:auto;min-height:684px; }
 .how-card { min-height:351px; }
 .store-button { height:50px; }
 .object-card { height:740px; }
 .object-card .object-photo { aspect-ratio:351/346; }
 .objects-section .object-carousel { margin-top:70px; }
 .about-intro-grid { grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:60px; }
 .about-copy h1,.about-stats h2,.about-partners h2 { font-size:45px;line-height:57px; }
 .about-intro { min-height:0;padding:100px 0; }
 .about-stats,.about-partners { padding:100px 0;min-height:0; }
 .stat-card h3 { font-size:34px; }
 .partner-samarkand { transform-origin:0 0; }
 .contact-card { grid-template-columns:1.35fr 1fr 1fr;gap:30px; }
 .contact-card h3 { font-size:23px;line-height:28px; }
 .contact-card p { font-size:17px;line-height:25px; }
 .footer-inner { column-gap:24px; }
 .footer-contact p,.footer-contact>a { font-size:14px;line-height:24px; }
}
@media(min-width:769px) and (max-width:1100px) {
 .about-intro-grid { grid-template-columns:1fr;gap:50px; }
 .about-text { max-width:none; }
 .about-gallery { max-width:714px; }
 .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .partner-grid { grid-template-columns:1fr;gap:45px; }
 .souvenir-benefits { grid-template-columns:1fr; }
 .footer-inner { grid-template-columns:1fr 230px; }
 .footer-contact { grid-column:1/-1;grid-row:2;justify-self:start;margin-top:35px; }
 .footer-line { grid-row:3;margin-top:35px; }
 .copyright { grid-row:4;margin-top:60px; }
}
@media(max-width:768px) {
 .about-page .site-header { height:100px; }
 .about-page .mobile-menu { top:100px; }
 /* The source mobile headings are 26px, not the 33px hero title. */
 .features-section { padding:106px 0 70px; }
 .features-section h2 { font-size:26px;line-height:33px;margin:0 30px 40px;max-width:300px; }
 .feature-track,.feature-extra { gap:10px; }
 .feature-card,.feature-extra .feature-card { height:561px;min-height:561px; }
 .feature-media { height:324px; }
 .feature-body { padding:9px 30px 30px; }
 .feature-body h3 { font-size:20px;line-height:26px;min-height:26px; }
 .feature-body p { font-size:15px;line-height:19px;margin-top:20px;font-weight:500; }
 .features-section .features-subtitle { font-size:22px!important;line-height:28px!important;margin:70px 30px 40px!important;max-width:300px; }
 .feature-extra .feature-body { padding:11px 30px 30px; }
 .feature-extra .feature-body h3 { font-size:20px;line-height:26px;min-height:52px; }
 .feature-extra .feature-body p { margin-top:20px; }
 .features-section .extra-controls { margin-top:20px; }
 .how-panel { display:flex;flex-direction:column;gap:0;padding:70px 0;border-radius:25px;min-height:0; }
 .how-intro { position:relative;min-height:261px;padding:0 30px; }
 .how-intro h2 { font-size:26px;line-height:33px; }
 .how-intro p { font-size:15px;line-height:19px;margin:30px 0 0; }
 .how-intro .how-note { margin-top:19px; }
 .how-play { width:60px;height:60px;left:30px;top:270px;bottom:auto;z-index:4; }
 .how-visual { width:100%;height:auto;aspect-ratio:360/504;min-height:0;border-radius:0;flex:none; }
 .how-visual::before { content:'';position:absolute;z-index:1;left:0;right:0;top:0;height:150px;background:linear-gradient(#000,transparent); }
 .how-choice { padding:0 30px;width:100%;margin-top:70px; }
 .how-choice > h3 { font-size:22px;line-height:28px; margin:0 0 40px; }
 .how-options { gap:10px; }
 .how-card { height:287px;min-height:287px;border-radius:20px;padding:30px; }
 .how-card h4 { font-size:20px;line-height:26px; }
 .how-card p { font-size:15px;line-height:19px;margin:20px 0 0; }
 .store-buttons { margin-top:auto;gap:10px; }
 .store-button { width:100%;height:40px;min-height:40px; }
 .qr-decoration { width:102px;height:54px; }
 .qr-decoration img { width:54px;height:54px; }
 .qr-scan-line { height:3px; }
 .objects-section { padding:70px 0; }
 .objects-section h2 { font-size:26px;line-height:33px; }
 .objects-section .object-carousel { margin-top:70px; }
 .object-card { height:606px;min-height:606px;padding-bottom:25px; }
 .object-card .object-photo { aspect-ratio:300/293; }
 .object-card > .object-title { margin:30px 30px 0;min-height:104px;font-size:20px;line-height:26px; }
 .object-card .object-actions { grid-template-rows:40px 40px 36px;gap:10px;padding:14px 30px 0; }
 .object-card .object-actions a { height:40px;min-height:40px;padding:8px 6px;font-size:15px;line-height:24px; }
 .object-card .object-actions a.object-map { font-size:11px;min-height:26px;height:26px;margin-top:0;padding:0; }
 .object-photo > .city-badge { font-size:11px;padding:5px 16px; }
 .try-panel { display:block;padding:70px 30px;border-radius:25px; }
 .try-copy h2 { font-size:26px;line-height:33px; }
 .try-copy p { font-size:15px;line-height:19px;margin:30px 0 0; }
 .try-copy .mobile-try-note { display:block;margin-top:13px; }
 .marker-demo { margin-top:40px;aspect-ratio:299/225;width:100%; }
 .try-nav { display:none; }
 .museum-section { padding:70px 0; }
 .museum-section h2 { font-size:26px;line-height:33px; }
 .museum-intro { font-size:15px;line-height:19px;margin:30px 0 40px; }
 .museum-collage { height:auto;width:100%;object-fit:contain; }
 .benefit-grid { grid-template-columns:1fr;gap:50px; margin-top:70px; }
 .benefit-grid article { min-height:0; }
 .benefit-grid h3 { font-size:20px;line-height:26px; }
 .benefit-grid p { font-size:15px;line-height:19px;margin-top:20px; }
 .museum-shell > .wide-button { margin-top:50px;width:100%;height:40px;min-height:40px;padding:8px;font-size:15px; }
 /* On mobile the postcard hero sits behind the wordmarks, ahead of its body copy. */
 .souvenir-section { padding:0; }
 .souvenir-shell { display:block;position:relative;width:100%;padding:0 0 70px;overflow:hidden; }
 .souvenir-copy { display:contents; }
 .tourist-script { position:absolute;z-index:3;left:30px;top:70px;width:calc(100% - 60px);height:auto;aspect-ratio:297.847/35.953; }
 .desktop-wordmark { display:none; }
 .mobile-wordmark { display:block;width:100%;height:100%; }
 .special-edition { position:absolute;z-index:3;left:50%;top:131px;transform:translateX(-50%);width:148px;height:21px;margin:0; }
 .souvenir-art { position:absolute;left:0;top:93px;width:100%;height:auto;aspect-ratio:360/527;margin:0;border-radius:0; }
 .souvenir-art-desktop { display:none; }
 .souvenir-art-mobile { display:block;width:100%;height:100%; }
 .souvenir-art::before { content:'';position:absolute;z-index:1;left:0;right:0;top:0;height:117px;background:linear-gradient(#000,transparent); }
 .souvenir-art::after { content:'';position:absolute;z-index:1;left:0;right:0;bottom:0;height:70px;background:linear-gradient(transparent,#000); }
 .souvenir-copy h2 { padding-top:642px;margin:0 30px;min-height:0;font-size:22px;line-height:28px;max-width:301px; }
 .souvenir-copy > p { margin:30px 30px 0;min-height:138px;font-size:15px;line-height:19px; }
 .souvenir-play { position:absolute;z-index:4;top:542px;left:30px;width:60px;height:60px;margin:0; }
 .postcard-stage { width:100%;height:201.04px;aspect-ratio:auto;margin:30px 0 0; }
 .postcards-desktop { display:none; }
 .postcards-mobile { display:block;left:50%;margin-left:-204.25267px; }
 .souvenir-benefits { display:grid;grid-template-columns:1fr;margin:61px 30px 0;gap:46px; }
 .souvenir-benefits h3 { font-size:20px;line-height:26px; }
 .souvenir-benefits p { font-size:15px;line-height:19px;margin-top:20px; }
 .souvenir-order { display:grid;place-items:center;margin:70px 30px 0;width:calc(100% - 60px);height:40px;min-height:40px;font-size:15px; }
 .contact-section { padding:70px 0; }
 .contact-section h2 { font-size:26px;line-height:33px; }
 .contact-card { display:flex;flex-direction:column;gap:43px;padding:30px;min-height:484px; margin-top:35px;border-radius:25px; }
 .contact-card > div:first-child { padding:0; }
 .contact-card h3 { font-size:20px;line-height:20px; }
 .contact-card p { font-size:15px;line-height:23px;margin-top:32px; }
 .contact-method p { margin-top:15px; }
 .footer-inner { display:flex;flex-direction:column;align-items:center;min-height:510px;padding:70px 0 40px;gap:0; }
 .footer-logo { order:0;width:140px;height:auto;margin:0; }
 .footer-contact { order:1;margin-top:74px;align-self:center;text-align:center; }
 .footer-contact p,.footer-contact > a { justify-content:center;font-size:13px;line-height:20px;gap:10px;margin-bottom:18px; }
 .footer-contact p img,.footer-contact>a img { margin-top:1px; }
 .socials { order:2;width:100%;padding:21px 35px;border-top:1px solid #333;border-bottom:1px solid #333;margin-top:27px; }
 .footer-line { display:none; }
 .copyright { order:3;margin:30px 0 0;font-size:12px;line-height:20px; }
 /* About mobile: same text first, then gallery, six stats, partners and common footer. */
 .about-intro { padding:80px 0 70px;min-height:0; }
 .about-intro-grid { display:block; }
 .about-copy h1 { font-size:33px;line-height:42px;font-weight:500;margin:0 0 30px; }
 .about-text { font:400 15px/19px Onest,Arial,sans-serif;max-width:100%; }
 .about-text p { margin-bottom:19px; }
 .about-gallery { padding-top:0;margin-top:50px; }
 .about-track { gap:10px;width:calc(100% + 30px);padding-right:30px; }
 .about-slide { flex-basis:calc(100% - 30px);border-radius:20px; }
 .about-controls { width:100%;height:9px;margin:20px auto 0; }
 .about-controls button:not(.step-dot) { display:none; }
 .about-stats { padding:70px 0; }
 .about-stats h2,.about-partners h2 { font-size:26px;line-height:33px; }
 .stats-grid { grid-template-columns:1fr;gap:10px;margin-top:45px; }
 .stat-card { min-height:140px;padding:25px;border-radius:20px; }
 .stat-card h3 { font-size:25px;line-height:32px; }
 .stat-card p { font-size:15px;line-height:19px;margin-top:15px; }
 .about-partners { min-height:0;padding:70px 0; }
 .about-partners h2 { max-width:300px;font-weight:500; }
 .partner-grid { margin-top:60px;grid-template-columns:1fr 1fr;gap:28px 20px; }
 .partner-first { width:138px;height:33px;margin-top:2px; }
 .partner-samarkand { width:349.279px;max-width:none;height:86.51px;transform:scale(.40083);transform-origin:0 0;margin:0; }
 .partner-grid > .partner-samarkand { margin-bottom:-51.83px; }
 .partner-third { width:93px;height:34px; }
}
@media(min-width:481px) and (max-width:768px) {
 .souvenir-art { height:527px;aspect-ratio:auto; }
 .tourist-script { max-width:380px;left:50%;transform:translateX(-50%); }
 .how-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .how-card { height:auto;min-height:350px;padding:24px; }
 .store-button { height:40px;min-height:40px; }
 .about-slide { max-width:550px; }
}
@media(max-width:359px) {
 .feature-card,.feature-extra .feature-card { height:auto;min-height:561px; }
 .feature-media { height:auto;aspect-ratio:718/776; }
 .feature-body,.feature-extra .feature-body { padding-inline:22px; }
 .object-card > .object-title { margin-inline:22px; }
 .object-card .object-actions { padding-inline:22px; }
 .object-card { height:auto;min-height:606px; }
 .how-card { padding:25px;height:auto;min-height:287px; }
 .souvenir-art { height:527px;aspect-ratio:auto; }
 .partner-grid { grid-template-columns:1fr; }
 .contact-card { padding:25px; }
}
@media(prefers-reduced-motion:reduce) { .postcard-canvas > img { will-change:auto; } }

/* Measured source corrections: mobile collage is a 450px-high moving window,
   not the desktop collage shrunk into a thumbnail. */
.special-edition { display:block; }
.museum-collage-mobile { display:none; }
@media(min-width:1600px) {
 .objects-section { min-height:1408px; }
 .museum-section { min-height:2003px; }
 .souvenir-section { min-height:1812px; }
}
@media(max-width:768px) {
 .tourist-script { height:35.953px;aspect-ratio:auto; }
 .tourist-script .mobile-wordmark { height:35.953px; }
 .museum-intro { min-height:120px;margin-bottom:60px; }
 .museum-collage { display:none; }
 .museum-collage-mobile { display:block;position:relative;width:calc(100% + 60px);height:450px;margin-left:-30px;overflow:hidden; }
 .museum-collage-mobile img { position:absolute;left:12px;top:-1px;display:block;width:1430px;height:452px;max-width:none;animation:museum-pan 10.002s linear infinite; }
 @keyframes museum-pan { 0%,.01%{transform:translateX(0)} 99.99%,100%{transform:translateX(-999px)} }
 .benefit-grid { margin-top:73px;gap:83px; }
 .benefit-grid article:nth-child(1) { min-height:219px; }
 .benefit-grid article:nth-child(2),.benefit-grid article:nth-child(3),.benefit-grid article:nth-child(4) { min-height:167px; }
 .benefit-grid article:nth-child(5) { min-height:214px; }
 .benefit-grid article:nth-child(6) { min-height:193px; }
 .benefit-grid article .benefit-icon { top:-3px; }
 .museum-shell > .wide-button { margin-top:94px; }
 .about-text { min-height:456px; }
}
@media(prefers-reduced-motion:reduce) { .museum-collage-mobile img {animation:none;} }
/* Source mobile postcard rectangle 858:1981 is light beige, with black wordmarks. */
@media(max-width:768px) {
 .souvenir-shell { background:linear-gradient(to bottom,#e0cec3 0,#e0cec3 210px,#000 210px); }
 .souvenir-art::before { background:linear-gradient(to bottom,#e0cec3 10.977%,rgba(233.38,219.24,211,.44824) 65.865%,rgba(241,230,224,0) 100%); }
 .souvenir-art::after { height:146px; }
 .souvenir-copy > p { line-height:23px; }
 .souvenir-benefits article { padding-top:4px; }
 .souvenir-benefits article:nth-child(1) { min-height:110px; }
 .souvenir-benefits article:nth-child(2) { min-height:148px; }
 .souvenir-benefits article:nth-child(3) { min-height:85px; }
 .souvenir-benefits h3 { line-height:24px; }
}
/* Remove high-specificity sizes left over from the early draft. */
.objects-section .section-shell > h2 { max-width:1077px;width:min(1077px,100%); }
.object-controls button.step-dot { display:grid;place-items:center;flex:none;width:9px;height:33px;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:transparent;font-size:0; }
.object-controls button.step-dot.is-active { width:30px; }
.object-controls button.step-dot::before { content:none; }
.object-controls .step-dots { gap:6px; }
@media(min-width:769px) {
 .souvenir-benefits { min-height:165px; }
 .souvenir-benefits article { min-height:0; }
 .contact-card { padding-bottom:38px; }
}
@media(max-width:768px) {
 .about-slide { flex-basis:100%; }
}

/* Release 8: only ready material is interactive. */
[data-optional-material][hidden] { display:none!important; }
.language-menu button:disabled,.mobile-languages button:disabled { cursor:default; opacity:.6; }
/* A missing PDF must not leave a whole empty button row. */
.museum-section:not(.has-presentation) .benefit-grid { margin-bottom:0; }
/* Source still position before the WAAPI player starts. */
.qr-scan-line { top:29.62961578px; }
@media(max-width:768px) { .qr-scan-line { top:25px; } }
/* Keep source minimum sizes, but allow text to grow after a web-font swap.
   Flex tracks stretch peer cards to the same height instead of clipping text. */
.feature-track .feature-card,.feature-extra .feature-card,.object-track .object-card { height:auto; }


/* Release 10: native navigation for touch, slow networks and missing JavaScript.
   It does not depend on video playback, Google Fonts or animation initialization. */
.mobile-navigation { display:none; margin:0; padding:0; border:0; }
.mobile-navigation > summary { list-style:none; cursor:pointer; }
.mobile-navigation > summary::-webkit-details-marker { display:none; }
.mobile-navigation > summary::marker { content:""; }
.mobile-navigation:not([open]) > .mobile-menu { display:none!important; }
@media (max-width:1100px) {
 .mobile-navigation { display:block; flex:0 0 0; }
 .mobile-navigation > .menu-button { display:block; }
 .mobile-navigation[open] > .menu-button span:first-child { top:19px; transform:rotate(45deg); }
 .mobile-navigation[open] > .menu-button span:last-child { top:19px; transform:rotate(-45deg); }
 .mobile-navigation[open] > .mobile-menu {
  display:flex; position:absolute; z-index:40; top:82px; left:0; right:0; width:100%;
  transform:none; opacity:1; pointer-events:auto; transition:none;
  flex-direction:column; gap:0; padding:14px 30px 20px; background:#000;
  max-height:calc(100vh - 82px); overflow-y:auto; overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
 }
 .mobile-navigation .mobile-menu > a { display:flex; align-items:center; min-height:48px; padding-block:12px; }
 .mobile-navigation .mobile-menu > .primary-button { margin-top:12px; justify-content:center; }
 .mobile-navigation .mobile-menu > a:focus-visible { outline:2px solid #1977f3; outline-offset:3px; }
}
@media (max-width:768px) {
 .mobile-navigation[open] > .mobile-menu, .about-page .mobile-navigation[open] > .mobile-menu {
  top:100px; max-height:calc(100vh - 100px); padding-bottom:max(20px,env(safe-area-inset-bottom));
 }
}
@supports (height:100dvh) {
 @media (max-width:1100px) { .mobile-navigation[open] > .mobile-menu { max-height:calc(100dvh - 82px); } }
 @media (max-width:768px) {
  .mobile-navigation[open] > .mobile-menu, .about-page .mobile-navigation[open] > .mobile-menu { max-height:calc(100dvh - 100px); }
 }
}

/* Release 11 — user review fixes (mobile fidelity + restored tutorial media). */
/* Keep original store artwork proportional instead of cropping its 291×50 source SVG on mobile. */
.store-button > img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  transform: none !important;
}
.consultation-button { text-decoration: none; }

@media (max-width: 480px) {
  /* Mobile museum section follows the source frame 858:2029 (360×2615).
     Exact benefit title starts: 869, 1171, 1421, 1671, 1921, 2218px. */
  .museum-section { min-height: 2615px; padding: 70px 0; }
  .benefit-grid { margin-top: 73px; gap: 83px; }
  .benefit-grid article { min-height: 0; }
  .benefit-grid article:nth-child(1) { height: 219px; }
  .benefit-grid article:nth-child(2),
  .benefit-grid article:nth-child(3),
  .benefit-grid article:nth-child(4) { height: 167px; }
  .benefit-grid article:nth-child(5) { height: 214px; }
  .benefit-grid article:nth-child(6) { height: 193px; }
  /* In the Figma source the first and fifth descriptions start 124px after the title. */
  .benefit-grid article:nth-child(1) p,
  .benefit-grid article:nth-child(5) p { margin-top: 46px; }
  .benefit-grid article:nth-child(2) p,
  .benefit-grid article:nth-child(3) p,
  .benefit-grid article:nth-child(4) p,
  .benefit-grid article:nth-child(6) p { margin-top: 20px; }
  .museum-shell > .wide-button {
    display: grid;
    place-items: center;
    width: min(300px, calc(100vw - 60px));
    height: 40px;
    min-height: 40px;
    margin: 94px 0 0;
    padding: 8px;
    font-size: 15px;
  }

  /* Original 291×50 store artwork is proportionally reduced into the 240×40 mobile content width. */
  .how-options { width: min(300px, 100%); max-width: 300px; }
  .how-card .store-buttons { width: 100%; }
  .how-card .store-button { width: 100%; height: 40px; min-height: 40px; }

  /* Keep all mobile contact columns on one left edge and preserve the 484px design card. */
  .contact-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: 484px;
    padding: 30px;
    gap: 43px;
  }
  .contact-card > *,
  .contact-method { width: 100%; min-width: 0; margin-left: 0; margin-right: 0; align-self: stretch; }
  .contact-method { padding: 0; align-items: flex-start; }
  .contact-method > span,
  .contact-method > p { margin-left: 0; }
}
@media (max-width: 480px) {
  /* Anchor description baselines to the source mobile coordinates, independent of font fallback. */
  .benefit-grid article > p { position:absolute; left:60px; right:0; margin:0; }
  .benefit-grid article:nth-child(1) > p,
  .benefit-grid article:nth-child(5) > p { top:124px; }
  .benefit-grid article:nth-child(2) > p,
  .benefit-grid article:nth-child(3) > p,
  .benefit-grid article:nth-child(4) > p { top:72px; }
  .benefit-grid article:nth-child(6) > p { top:98px; }
}
@media (max-width: 480px) {
  .benefit-grid article > p { margin:0 !important; }
}

/* Release 12 — iPhone centering + stable mobile proportions. */
@media (max-width: 480px) {
  /* Keep the 360px Figma card width (300px) centered on wider phones. */
  .how-choice { padding-inline: 0; }
  .how-choice > h3,
  .how-options {
    width: min(300px, calc(100vw - 60px));
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
  }
  .how-options { align-items: center; }
  .how-card {
    width: 100%;
    max-width: 300px;
    align-self: center;
  }
  .how-card .store-buttons {
    width: 100%;
    max-width: 240px;
    margin-left: auto;
    margin-right: auto;
  }
  .how-card .store-button { width: 100%; }
  .how-card .qr-decoration { margin-left: auto; margin-right: auto; }

  /* The CTA is a 300×40 element in the 360px mobile design; center it on wider phones. */
  .museum-shell > .wide-button.consultation-button {
    width: min(300px, calc(100vw - 60px));
    margin-left: auto;
    margin-right: auto;
  }
}